从网上找了很多关于placeholder IE兼容性的问题,下边的这个js方法可以显示password。

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Placeholder Polyfill Test</title>
</head>
<body> <form>
<input type="password"placeholder="password">
<input type="password"placeholder="confirm password">
</form> <script src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
<script> /* placeholder polyfill plugin */ /*! http://mths.be/placeholder v2.0.7 by @mathias */
(function(f, h, $) {
var a='placeholder'in h.createElement('input'), d='placeholder'in h.createElement('textarea'), i=$.fn, c=$.valHooks, k, j; if(a&&d) {
j=i.placeholder=function() {
return this
}
;
j.input=j.textarea=true
}
else {
j=i.placeholder=function() {
var l=this; l.filter((a?'textarea':':input')+'[placeholder]').not('.placeholder').bind( {
'focus.placeholder':b, 'blur.placeholder':e
}
).data('placeholder-enabled', true).trigger('blur.placeholder');
return l
}
;
j.input=a;
j.textarea=d; k= {
get:function(m) {
var l=$(m);
return l.data('placeholder-enabled')&&l.hasClass('placeholder')?'':m.value
}
, set:function(m, n) {
var l=$(m); if(!l.data('placeholder-enabled')) {
return m.value=n
}
if(n=='') {
m.value=n; if(m!=h.activeElement) {
e.call(m)
}
}
else {
if(l.hasClass('placeholder')) {
b.call(m, true, n)||(m.value=n)
}
else {
m.value=n
}
}
return l
}
}
;
a||(c.input=k);
d||(c.textarea=k); $(function() {
$(h).delegate('form', 'submit.placeholder', function() {
var l=$('.placeholder', this).each(b); setTimeout(function() {
l.each(e)
}
, 10)
}
)
}
); $(f).bind('beforeunload.placeholder', function() {
$('.placeholder').each(function() {
this.value=''
}
)
}
)
}
function g(m) {
var l= {
}
, n=/^jQuery\d+$/; $.each(m.attributes, function(p, o) {
if(o.specified&&!n.test(o.name)) {
l[o.name]=o.value
}
}
);
return l
}
function b(m, n) {
var l=this, o=$(l); if(l.value==o.attr('placeholder')&&o.hasClass('placeholder')) {
if(o.data('placeholder-password')) {
o=o.hide().next().show().attr('id', o.removeAttr('id').data('placeholder-id')); if(m===true) {
return o[0].value=n
}
o.focus()
}
else {
l.value='';
o.removeClass('placeholder');
l==h.activeElement&&l.select()
}
}
}
function e() {
var q, l=this, p=$(l), m=p, o=this.id; if(l.value=='') {
if(l.type=='password') {
if(!p.data('placeholder-textinput')) {
try {
q=p.clone().attr( {
type: 'text'
}
)
}
catch(n) {
q=$('<input>').attr($.extend(g(this) {
type: 'text'
}
))
}
q.removeAttr('name').data( {
'placeholder-password':true, 'placeholder-id':o
}
).bind('focus.placeholder', b); p.data( {
'placeholder-textinput':q, 'placeholder-id':o
}
).before(q)
}
p=p.removeAttr('id').hide().prev().attr('id', o).show()
}
p.addClass('placeholder');
p[0].value=p.attr('placeholder')
}
else {
p.removeClass('placeholder')
}
}
}
(this, document, jQuery));
</script>
<script> $('input').placeholder();
</script>
</body>
</html>

转自这里 http://zach.lysobey.com/files/placeholder/index.html

05-14 01:10