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

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

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

});

时间: 2024-11-09 04:16:55

邮箱登陆界面占位符(placeholder)jQuery法的相关文章

占位符(placeholder text)

占位符(placeholder text)是用户在input(输入)框输入任何东西之前放置在input(输入)框中的预定义文本. 你可以用如下方式创建占位符: <input type="text" placeholder="this is placeholder text">

[Sass]占位符 %placeholder

[Sass]占位符 %placeholder Sass 中的占位符 %placeholder 功能是一个很强大,很实用的一个功能,这也是我非常喜欢的功能.他可以取代以前 CSS 中的基类造成的代码冗余的情形.因为 %placeholder 声明的代码,如果不被 @extend 调用的话,不会产生任何代码.来看一个演示: %mt5 { margin-top: 5px; } %pt5{ padding-top: 5px; } 这段代码没有被 @extend 调用,他并没有产生任何代码块,只是静静的躺

js跳转输入邮箱登陆界面

<script> var hash = { // 邮箱域名对应的邮箱登录地址 'qq.com' : 'http://mail.qq.com', 'gmail.com' : 'http://mail.google.com', 'sina.com' : 'http://mail.sina.com.cn', 'sina.cn' : 'http://mail.sina.com.cn', '163.com' : 'http://mail.163.com', '126.com' : 'http://mai

UITextView加占位符placeholder

@property (nonatomic ,retain) UITextView * contentText; @property (nonatomic ,retain) NSString * placeholderText; - (void)viewDidLoad{    [super viewDidLoad];    // Do any additional setup after loading the view. [email protected]"这一刻的想法..."; _c

sass 继承 占位符 %placeholder

@extend //SCSS .btn { border: 1px solid #ccc; padding: 6px 10px; font-size: 14px; } .btn-primary { background-color: #f36; color: #fff; @extend .btn; } .btn-second { background-color: orange; color: #fff; @extend .btn; } 编译出来的css //CSS .btn, .btn-pri

HTML写的第一个邮箱登陆界面

自己动手去写才会有收获,宁可模仿也不要全部复制粘贴 不说了,直接上代码.CSS有注释,适合新手. <!doctype html> <html> <head> <meta charset="utf-8"> <title>Login</title> <link rel="stylesheet" href="3.css" /> </head> <bod

RunTime运行时在iOS中的应用之UITextField占位符placeholder

RunTime运行时机制 runtime是一套比较底层的纯C语言API, 属于1个C语言库, 包含了很多底层的C语言API. 在我们平时编写的OC代码中, 程序运行过程时, 其实最终都是转成了runtime的C语言代码, runtime算是OC的幕后工作者,下面介绍一下runtime的一个应用用于遍历出UITextField的有那些隐藏属性,查出后再通过KVC来进行修改这个属性 //第一次用到这类的时候就会调用的只会调用一次方法 ,这个方法查的时候用一下 ,以后不用 + (void)initia

修改占位符(placeholder)默认颜色、字体设置

方法: 选择器名字::-webkit-input-placeholder {color: #F85836;font-size:12px;} 选择器名字:-moz-placeholder {color: #F85836;font-size:12px;} 选择器名字:-ms-input-placeholder {color: #F85836;font-size:12px;} 例如: .form-control::-webkit-input-placeholder {color: #F85836;fo

Sass 混合宏、继承、占位符 详解

混合宏-声明混合宏如果你的整个网站中有几处小样式类似,比如颜色,字体等,在 Sass 可以使用变量来统一处理,那么这种选择还是不错的.但当你的样式变得越来越复杂,需要重复使用大段的样式时,使用变量就无法达到我们目了.这个时候 Sass 中的混合宏就会变得非常有意义.1.声明混合宏不带参数混合宏:在 Sass 中,使用"@mixin"来声明一个混合宏.如: 1 @mixin border-radius{ 2 -webkit-border-radius: 5px; 3 border-rad