html

<form method="post" action="">
<ul>
<li>
<span>邮箱</span>
<input type="text" name="email" value="请输入邮箱" onfocus="if(value == '请输入邮箱'){value =''}" onblur="if(value == ''){value ='请输入邮箱'}" >
</li>
<li>
<span>密码</span>
<input name="" type="text" value="密码" id="text" >
<input name="" type="password" style="display:none;" id="password">
</li>
<li>
<span>验证码</span>
<input type="text" name="code" class="code">
<img src="">
</li>
<li>
<span></span>
<label><input type="checkbox" checked="checked" name="check" class="checked"><i>记住密码</i></label>
<a href="" class="forget">忘记密码</a>
</li>
<li>
<span></span>
<a href="" class="login-btn">登录</a>
</li>
</ul>
</form>

jquery

<script type="text/javascript">
function _password(hid,pid){
var _hid = $("#"+hid);
var _pid = $("#"+pid);
_hid.focus(function(){
var _hval = $.trim($(this).val());
if(_hval != "密码") return;
$(this).css("display","none");
_pid.css("display","block").val("").focus();
});
_pid.blur(function(){
var _hval = $.trim($(this).val());
if(_hval != "") return;
$(this).css("display","none");
_hid.css("display","block").val("密码");
})
}
_password('text','password')
</script>

  

jquery 处理密码输入框(input type="password" ) 模仿placeholder的更多相关文章

  1. [转载]Js小技巧||给input type=“password”的输入框赋默认值

    http://www.cnblogs.com/Raywang80s/archive/2012/12/06/2804459.html [转载]Js小技巧||给input type="passw ...

  2. BUG笔记:Win8 IE10下input[type="password"]内字符显示被截取问题

    这个BUG发生的截图: 这是发生在Windows8 IE10下,type为password的input文本框内输入长串字符后,初次失去焦点的时候会发生的一个BUG. 发生BUG的原因是这个文本框上应用 ...

  3. input type=password 浏览器会自动填充密码的问题

    解决办法是在form上或input上添加autoComplete="off"这个属性. form表单的属性如下所示: 但是这个解决方案在谷歌和火狐上均有bug,下面来一个一个解决. ...

  4. input type="datetime-local" 时placeholder不显示

    一个坑,input的type="datetime-local" 时,电脑上会显示提示,如图 <input type="datetime-local" na ...

  5. chrome下input[type=text]的placeholder不垂直居中的问题解决

    http://blog.csdn.net/do_it__/article/details/6789699 <input type="text" placeholder=&qu ...

  6. 手机端input[type=date]的placeholder不起作用

    <div class="input clearfix"> <label class="fl">起始日期</label> &l ...

  7. 利用jquery来隐藏input type="file"

    <li> <input type="text" name="token" value = "<?php ech$_SESSIO ...

  8. jquery对所有<input type="text"的控件赋值

    function resetData() {      $("input[type=text]").each(      function() {     $(this).attr ...

  9. input type="tel" 数字输入框显示圆点

    最近开发中遇到一个这样的需求,要求input输入框在手机端出现数字键盘的同时显示圆点,试过各种方法都不太理想, 最终经过查阅大量资料后,终于实现了需求. ●我们一般的密码输入框是这样的: <in ...

随机推荐

  1. android 5.0 受欢迎的API简介

    android 5.0 作为系统的一次重大升级,给用户和开发者带来了全新的体验.Material Design不但在视觉和操作上更胜一筹,扩展UI工具包同时也引入了大量新的API. 1. 3D视图和实 ...

  2. struts2 result的type属性

    目前只使用过以下3种,都是直接跳转到另一个action  chain: 写法:<result name="success" type="chain"> ...

  3. hdu Phone List

    Problem Description Given a list of phone numbers, determine if it is consistent in the sense that n ...

  4. 各邮箱服务器地址及端口<转>

    gmail(google.com) POP3服务器地址:pop.gmail.com(SSL启用端口:995) SMTP服务器地址:smtp.gmail.com(SSL启用 端口:587) 21cn.c ...

  5. sudo 无法解析主机的解决办法

    错误存在于更改主机名字后,解决办法如下: sudo gedit /etc/hosts找到如下行:127.0.1.1       XXX将其修改为:127.0.1.1       (你现在的主机名) 保 ...

  6. python计算机视觉1:基本操作与直方图

    本文主要内容来源于书籍<python计算机视觉编程> 我是一名初学者,如果你发现文中有错误,请留言告诉我,谢谢 PIL模块 PIL模块全程为Python Imaging Library,是 ...

  7. MVC 学习随笔(一)

    Model的绑定. (一)使用NameValueCollectionValueProvider C# 对NameValueCollectionValueProvider的支持是通过下面的类实现的 // ...

  8. AFNetworking实现 断点续传

    用AFNetworking实现断点续传,暂停,继续   AFNetworking断点续传暂停恢复 AFNetworking的版本:platform:ios,'7.0' pod "AFNetw ...

  9. OC和C语言的混编注意点和好处

    苹果的Objective-C编译器批准用户在统一个源文件里自由地混杂利用C++和Objective-C,混编后的语言叫Objective-C++.有了它,你就能够在Objective-C利用过程中利用 ...

  10. PowerShell官方的MSDN

    https://msdn.microsoft.com/en-us/powershell/mt173057.aspx 官方还咋github上放置了  扩展模块. 比如 web iis部署.sqlserv ...