占位符属性在Internet Explorer中不起作用
使用JavaScript和jQuery的组合来解决不在Internet Explorer中工作的占位符问题的解决方案如下。
我必须重申,在Internet Explorer中不能工作的占位符问题的解决方案如下使用JavaScript和jQuery的组合。
//DETERMINE BROWSER TYPE
var browser='';
jQuery.each(jQuery.browser, function(i, val) {
if(i=='msie')browser=i;
});
if(browser=='msie'){
var password = '<input type="text" value="Password" placeholder="Password" name="q22" class="form-gen-element" id="ie-password-holder" />';
$(password)
.insertAfter($('input[name="q2"]'));
$('input[name="q2"]')
.hide();
//INTERNET EXPLORER PLACEHOLDER FIX
$('#login-content')
.find('.form-gen-element')
.focus(function(){
if($(this).val()==$(this).attr('placeholder')){
//Move cursor position
if ($(this).get(0).setSelectionRange) {
$(this).get(0).setSelectionRange(0, 0);
} else if ($(this).get(0).createTextRange) {
var range = $(this).get(0).createTextRange();
range.collapse(true);
range.moveEnd('character', 0);
range.moveStart('character', 0);
range.select();
}
}
})
.blur(function(){
if($(this).val()==''){
$(this).val($(this).attr('placeholder'));
if($(this).attr('name')=='q2')
$(this).attr('type','text');
}
})
.keydown(function(e){
if($(this).val()==$(this).attr('placeholder')){
if((e.keyCode > 47 && e.keyCode < 91) || e.keyCode==109 || e.keyCode==110 || e.keyCode==190 || e.keyCode==110){
var t = $(this).val().split($(this).attr('placeholder'));
$(this).val(t[0]);
//Handle password attribute change
if($(this).attr('name')=='q22'){
$(this).attr('type','password');
}
}
}
});
}else{
//OTHER BROWSERS DEFAULT FUNCTIONALITY
$('#login-content')
.find('.form-gen-element')
.val('');
}
});
查看以下有用的SO问题
Internet Explorer的输入占位符