占位符placeholder的益处不用多说，但是很不幸的是，在IE8之前的浏览器里是无法实现placeholder这一属性的，所以在需要兼容IE8之前的浏览器的情况下，我们不得不想办法模拟实现placeholder属性。
在前面的一篇文中《获取表单的初始值，模拟placeholder属性》中，就曾经讲过placeholder属性的模拟，这里再翻出来一遍，是因为又遇到了新的问题。
当输入值之后，再刷新页面，在火狐浏览器中，获取到的defaultValue会是新的输入值。
直接以之前的项目中一小段代码为例：
<ul class="query-box">
<li><input type="text" value="请输入8位准考证号" placeholder="请输入8位准考证号" tabindex="1"></li>
<li class="img-verification">
<input type="text" value="请输入验证码" placeholder="请输入验证码" tabindex="2">
<div><img src="data:images/logo.png" alt=""></div>
</li>
<li>
<button tabindex="3">查询</button>
</li>
</ul>
该项目需要兼容到IE8，所以这里就必须解决IE8不支持placeholder这一属性的问题。项目中使用了jquery。
最开始的想法，就是使用初始值的方法，但是在火狐浏览器中测试时，发现了bug，当输入值之后，再刷新页面，火狐浏览器会记住所输入的值，作为初始值，导致不能完全模拟placeholder。只能转换方向，还是直接使用jquery方法来解决吧！
var permissionNum = /^\d{8}$/;
$(".query-box").find("input[type=text]").each(function (index, item) {
var defaultVal = $(this).prop('placeholder');
$(this).on("focus keydown", function () {
var val = $(this).val();
if (val == defaultVal) {
$(this).val("").css("color", "#448aca");
}
}).on("blur keyup", function () {
var val = $(this).val();
if (val == "") {
$(this).val(defaultVal).css("color", "#bababa");
}
// 校验准考证号码，符合8位数字，就高亮查询按钮
if (index == 0) {
var $target = $(this).parents(".query-box").find("button");
permissionNum.test(val) ? $target.addClass("active") : $target.removeClass("active");
}
})
});
也没有什么高深的东西，只要能转过这个弯来就可以了！