解决placeholder在IE浏览器不兼容的问题
解决方式:加上label标签。(IE显示该标签,其他浏览器不显示。)
1.html:
<div class="fl">
<label id="oldPwdTip">为了您账户安全请修改原始密码</label>
<input id="oldPwd" class="usertext" type="password" name="userName" placeholder="为了您账户安全请修改原始密码"
οnkeypress="hideOldPwdTip();" οnblur="toggleOldPwdTip(this.value);" />
<span id="oldPwdTip2"></span>
</div>
2.样式:(注意float和absolate)
.fl{ float:left; width:350px; margin-left:8px;}
#oldPwdTip{
position: absolute;
color : #ccc;
margin-top : 6px;
margin-left : 6px;
}
3.IE显示label脚本:
$(function(){ /* IE浏览器的输入框提示 */ var platform = navigator.platform; var o = navigator.appName ; if (o.toString().indexOf("Internet") == -1) { document.getElementById("oldPwdTip").style.cssText = "display: none;" ; document.getElementById("newPwdTip").style.cssText = "display: none;" ; document.getElementById("repeatPwdTip").style.cssText = "display: none;" ; } });
4.按下键盘不显示,失去焦点重新显示:
function hideOldPwdTip() { document.getElementById("oldPwdTip").style.cssText = "display: none;" ; } function toggleOldPwdTip(v) { if (!v) { var o = navigator.appName ; if (o.toString().indexOf("Internet") != -1) { document.getElementById("oldPwdTip").style.cssText = "display: block;" ; } } }
Chrome:
IE: