placeholder属性可以对用户做一个对输入内容的提醒或者指引,起到了很好的作用。但是万恶的IE9以下版本的浏览器不支持这个属性,这就让人比较蓝瘦了。
这里可以使用现成插件 jquery.placeholder.min.js来解决这个问题,该插件是使用是非常简单的。
第一步:
引入需要的两个js:jquery-1.11.0.min.js 和 jquery.placeholder.js,当然,也可以使用其他版本的jquery,不过最好不要太低。
第二步:
添加js代码:
$(function() {
$('input, textarea').placeholder({customClass:'my-placeholder'});
});
完整代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<input type="text" name="name" placeholder="请输入用户名">
<textarea name="merchantAddr" placeholder="请输入详细地址"></textarea>
<script src="jquery-1.11.0.min.js"></script>
<script src="jquery.placeholder.js"></script>
<script type="text/javascript">
$(function() {
$('input, textarea').placeholder({customClass:'my-placeholder'});
});
</script>
</body>
</html>
就是这么简单。