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

方法一:使用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. 使用symbolicatecrash分析crash文件

    对于我们iOS开发者来说,最心碎的事莫过于苹果审核一个星期后上架app store,而第二天就报出闪退bug.一周前我刚经历过,而且最坑的是由于第一次做个人开发,经验不足,没有集成友盟的分析SDK,还 ...

  2. Webpack 基本环境搭建

    1. 第一步安装之前 先npm init 创建 package.json cnpm init; 然后全局安装 cnpm install webpack -g 确保哪里都可以使用 cnpm instal ...

  3. 【转】iOS实时卡顿监控

    转自http://www.tanhao.me/code/151113.html/ 在移动设备上开发软件,性能一直是我们最为关心的话题之一,我们作为程序员除了需要努力提高代码质量之外,及时发现和监控软件 ...

  4. 转 - Web新人(偏前端)应该怎样学习(个人观点,勿喷)

    我自己是会计专业,转行自学web的,学习有一两年了,也还是新人一个,只不过不是那种超级“新”的,所以有什么话说得不对,请轻喷.欢迎大家来和我交流. 1.我能不能转行学web? 能不能学web这个不是别 ...

  5. OD: File Vulnerabilities & Protocols & Fuzz

    IE.Office 等软件有个共同点,即用文件作为程序的主要输入,但攻击者往往会挑战程序员的假定和假设. 文件格式 Fuzz 就是利用畸形文件测试软件的稳健性,其流程一般包括: * 以一个正常文件作为 ...

  6. MySQL安装与测试

    工作室老师要求我们把MySQL装出来 今天折腾了下,本来不难的,不知道为什么用最新5.6.24的msi安装包,安装的时候选完路径后就没有后续了..蛋疼的我试了好几次,用cmd命令测试一直是 2003- ...

  7. JAVA File转Byte[]

    /** * 获得指定文件的byte数组 */ public static byte[] getBytes(String filePath){ byte[] buffer = null; try { F ...

  8. python面对对象编程----1:BlackJack(21点)

    昨天读完了<Mastering Object-oriented Python>的第一部分,做一些总结. 首先,第一部分总过八章,名字叫Pythonic Classes via Specia ...

  9. php正则表达式总结

    <?php echo 'wj'; echo '<br>'; $file = '<td>移动150卡</td><!--<td></td& ...

  10. Nginx 反向代理配置实例(转)

    user www www; worker_processes ; error_log logs/error.log notice; pid logs/nginx.pid; worker_rlimit_ ...