placeholder是html5新增的input的一个熟悉,主要是让表单体验更加智能,相当于value属性,但是他有一个好处就是当我们聚焦输入文本的时候我们在placeholder="默认值"的文本就会自动清空,不过Ie浏览器对这个属性支持并不好还是自己用Jquery封装一个吧,以下代码理论上支持所有浏览器,不过使用这个方法会占用input的value属性在表单提交的时候需要判断一下
/* Jquery插件 Start */
jQuery.fn.setplaceholder=function(placeholderText,Color1,Color2){
if($(this).val()==""){
$(this).val(placeholderText);
$(this).css('color',Color1);
}else{
$(this).css('color',Color2);
}
$(this).focus(function(){
if($(this).val()==placeholderText){
$(this).val("");
$(this).css('color',Color2);
}
});
$(this).blur(function(){
if($(this).val()=="") {
$(this).val(placeholderText);
$(this).css('color',Color1);
}
});
}
/* Jquery插件 End */
//使用代码
$("#name").setplaceholder("我的称呼","#b4b4b4","#444");
$("#phone").setplaceholder("我的联系方式","#b4b4b4","#444");