需要实现的效果:一个输入框,当输入框未获得焦点的时候,显示为 “请输入密码”;当输入内容并失去焦点的时候,输入内容显示为”*****”,如果没有输入仍然显示“请输入密码”;

方法一:使用text,隐藏域中,然后配合onkeypress、onkeyup、focus、blur等事件基本可以达到要求,此种方法比较麻烦;

方法二:用text和password一起  

html: 

 <input type="password" id="input_password" class="m_input_se1 leftd" value='' style="display:none;color:#444;"/>
<input type="text" id="showPwd" class="m_input_se1 leftd" value="请输入密码" style="color:#c0c0c0"/>

js:

 $("#showPwd").focus(function() {
var text_value = $(this).val();
if (text_value == "请输入密码") {
$("#showPwd").hide();
$("#input_password").show().focus();
}
});
$("#input_password").blur(function() {
var text_value = $(this).val();
if (text_value == "") {
$("#showPwd").show();
$("#input_password").hide();
}
});

至此完美解决,所有浏览器都可以使用。

扩展内容:

本来想使用JQ的attr修改type属性值,但是发现在IE上会出错,如下:uncaught exception type property can't be changed

查看jQuery 1.42源码 1488 行

// We can't allow the type property to be changed (since it causes problems in IE)
if ( name === “type” && rtype.test( elem.nodeName ) && elem.parentNode ) {
  jQuery.error( “type property can't be changed” );
}

没办法,IE不支持修改type属性。

JQ无法修改input的type属性的替代解决方法的更多相关文章

  1. 修改input的type属性

    在ff和chrome中是可以直接修改input的type属性的,但是在ie下面是不允许的. 用jquery 的attr方法去修改,在jquery1.8.3版本会直接抛出异常,但在1.9及以上版本就不再 ...

  2. js修改input的type属性问题

    js修改input的type属性有些限制.当input元素还未插入文档流之前,是可以修改它的值的,在ie和ff下都没问题.但如果input已经存在于页面,其type属性在ie下就成了只读属性了,不可以 ...

  3. JQuery中如何动态修改input的type属性

    代码如下: jQuery(".member_id").focus(function() { jQuery(this).val(''); }).blur(function() { i ...

  4. ie8下修改input的type属性报错

    摘要: 现在有一个需求如图所示,当用户勾选显示明文复选框时,要以明文显示用户输入的密码,去掉勾选时要变回密文,刚开始想到的就是修改输入框的type来决定显示明文还是密文,使用jQuery的attr来做 ...

  5. js修改input的type属性问题(兼容所有浏览器,主要用于密码类的默认有提示文字的效果)

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  6. [Liferay6.2.2]AUI的小坑:input的type属性

    <aui:input name="name" label="姓名" value="<%=student.getName() %>&q ...

  7. html5 input的type属性启动数字输入法

    html5 input的type属性启动数字输入法   当文本框只能输入数字是一个很常见的需求,比如电话号码,身份证号,卡号, 数量....等等只允许数字输入,为了更好的用户体验性,直接写出 启动数字 ...

  8. input的type属性

    input的type属性:http://www.w3school.com.cn/tags/att_input_type.asp 基本语法: <input type="hidden&qu ...

  9. 在vuejs 中使用axios不能获取属性data的解决方法

    Laravel5.4 vuejs和axios使用钩子mounted不能获取属性data的解决方法 //出错问题:在then 这个里边的赋值方法this.followed = response.data ...

随机推荐

  1. Android Dialog 系统样式讲解及透明背景

      AlertDialog.Builder builder = new AlertDialog.Builder(DialogActivity.this,AlertDialog.THEME_TRADIT ...

  2. hdu 3631 Shortest Path(Floyd)

    题目链接:pid=3631" style="font-size:18px">http://acm.hdu.edu.cn/showproblem.php?pid=36 ...

  3. 理解 B*tree index内部结构

    转载请注明出处:http://write.blog.csdn.net/postedit/40589651 Oracle数据库里的B树索引就好象一棵倒长的树.它包括两种类型的数据块:一种是索引分支块,还 ...

  4. 获取CPU使用情况信息(转)

    获取了内存使用情况,也可以使用PHP的 getrusage()获取CPU使用情况,该方法在windows下不可用.    print_r(getrusage()); /* 输出 Array ( [ru ...

  5. POJ 2976 Dropping tests 01分数规划

    给出n(n<=1000)个考试的成绩ai和满分bi,要求去掉k个考试成绩,使得剩下的∑ai/∑bi*100最大并输出. 典型的01分数规划 要使∑ai/∑bi最大,不妨设ans=∑ai/∑bi, ...

  6. JavaScript中几个可以转化为false的值

    1.[0,NaN,“”,null,undefined]都可以直接转化为false,但这几个值不是完全相等的 var arr = [0,"",false,null,undefined ...

  7. YII框架路由和URL生成

    路由和URL生成 当一个YII应用开始处理一个请求的时候,它首先要做的便是将请求的URL转化成一个路由.路由的作用是用于后续实例化相应的控制器和操作,以便处理请求,整个处理过程便叫做路由.路由的逆过程 ...

  8. java -jar start.jar和nohup java -jar xxx.jar > test.log &的区别

    nohup用在什么地方? KD3EE49RD38

  9. SQL Server 2008 R2 的版本和组件

    SQL Server 2008 R2 的版本和组件 SQL Server 2008 R2   其他版本 SQL Server 2008 SQL Server 2005 SQL Server 2012 ...

  10. 解决Cacti监控图像断断续续问题

    最近cacti的图像全都是断断续续.新加的设备,图像也是这样,查看cacti 的log发现大量下面类似的错误信息:04/12/2011 03:54:37 PM - SPINE: Poller[0] H ...