大家都知道邮箱登陆的时候默认状态下会有文字提醒,当鼠标聚焦到邮箱文本框时,内容文字被会被清空。
html5下有占位符(placeholder)属性,但是兼容不是特别好~下面是jQuery的方法
css代码:
<input type="text" id="address" value="请输入邮箱地址" />
<input type="text" id="password" value="请输入密码" />
<input type="button" value="登录" />
jQuery代码:
$(function(){
$("#address").focus(function(){ //地址框获得鼠标焦点
var txt_value=$(this).val(); //得到当前文本框的值
if(txt_value==this.defaultValue){ //使用defaultValue属性
$(this).val(""); //如果符合条件,则清空文本框内容
};
});
$("#address").blur(function(){ //地址框失去鼠标焦点
var txt_value=$(this).val(); //得到当前文本框的值
if(txt_value==""){
$(this).val(this.defaultValue); //如果符合条件,则设置内容
};
});
});