码迷,mamicode.com
首页 > Web开发 > 详细

邮箱登陆界面占位符(placeholder)jQuery法

时间:2015-05-18 18:05:47      阅读:154      评论:0      收藏:0      [点我收藏+]

标签:

大家都知道邮箱登陆的时候默认状态下会有文字提醒,当鼠标聚焦到邮箱文本框时,内容文字被会被清空。

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);  //如果符合条件,则设置内容
             };
         });

});

 

邮箱登陆界面占位符(placeholder)jQuery法

标签:

原文地址:http://www.cnblogs.com/qdmaomao/p/4512181.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!