其实以前是通过给input|textarea设置value值来实现类似功能的,当input|textarea获得焦点时,将其value设置为空。但是有一个问题是对于密码输入框:
如 果再用设置value值的方法,密码输入框中的值将被黑点替代。使用placeholder则可以解决这个问题,目前支持placeholder的浏览器 为:Firefox4.0+、Chrome4.0+、Safari4.0+,Opera 11、IE9。对不支持的浏览器我们将使用模拟的placeholder属性的替代方法:
具体思路是:
1,首先判断浏览器是否支持placeholder属性,如果不支持则使用模拟placeholder
//判断是否支持placeholder属性
function isPlaceholer(){
var input = document.createElement(‘input’);
return “placeholder” in input;
}
2, 我们创建一个label标签: 标签里面的内容为所要添加的提示文案,该文案应该从对应的input|textarea标签取得其placeholder属性值,再将label标签遮盖 到所对应的input|textarea上。