placeholder是html5中的表单占位符,支持text,password及textarea等html5中新增的表单元素。既然是html5,那么当然只有高级浏览器可以支持了,不过没关系我们可以借用jquery插件来帮我们来解决这个兼容问题
如何使用
使用方法很简单,先加载一个jquery库,然后就是加载这个插件的js,最后就是使用了,在页面调用如下js
Js Code
<script type="text/javascript">
$(function() {
$('input, textarea').placeholder();
});
</script>
关于placeholder文字的颜色
火狐和webkit内核浏览器可以直接通过css来控制,分别为:-moz-placeholder
和::-webkit-input-placeholder
,调用这个js之后,会给不支持placeholder的加上placeholder这个class,所以整合起来就是:
Css Code
:-moz-placeholder, ::-webkit-input-placeholder{ color: #bfbfbf; } .placeholder{ color: #bfbfbf; }
注:请注意不要把这两个样式写在一起,如果集体声明ie8,9将不能正确解析.placeholder的样式。有点奇怪