placeholder属性是html5中的新属性,它的兼容性:IE10及以上、firefox、google chrome
该属性常用在input元素中,该属性的值将会以灰色的字体显示在文本框中,当文本框获得焦点的时候,该内容消失,失去焦点的时候,该内容显示(前提是该文本框的内容为空)。
对于IE9及以下的实现只能通过原生的js进行开发了,代码如下:
下面这个是一个js代码,但是这个要引入jquery.js包
$(document).ready(function(){
var doc=document,
inputs=doc.getElementsByTagName('input'),
supportPlaceholder='placeholder'in doc.createElement('input'),
placeholder=function(input){
var text=input.getAttribute('placeholder'),
defaultValue=input.defaultValue;
if(defaultValue==''){
input.value=text
}
input.οnfοcus=function(){
if(input.value==text)
{
this.value=''
}
};
input.οnblur=function(){
if(input.value==''){
this.value=text
}
}
};
if(!supportPlaceholder){
for(var i=0,len=inputs.length;i<len;i++){
var input=inputs[i],
text=input.getAttribute('placeholder');
if(input.type=='text'){
placeholder(input)
}
}
}
});
同时,这个不能实现是属于密码文本框的不能显示内容;