JQ无法修改input的type属性的替代解决方法
需要实现的效果:一个输入框,当输入框未获得焦点的时候,显示为 “请输入密码”;当输入内容并失去焦点的时候,输入内容显示为”*****”,如果没有输入仍然显示“请输入密码”;
方法一:使用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属性的替代解决方法的更多相关文章
- 修改input的type属性
在ff和chrome中是可以直接修改input的type属性的,但是在ie下面是不允许的. 用jquery 的attr方法去修改,在jquery1.8.3版本会直接抛出异常,但在1.9及以上版本就不再 ...
- js修改input的type属性问题
js修改input的type属性有些限制.当input元素还未插入文档流之前,是可以修改它的值的,在ie和ff下都没问题.但如果input已经存在于页面,其type属性在ie下就成了只读属性了,不可以 ...
- JQuery中如何动态修改input的type属性
代码如下: jQuery(".member_id").focus(function() { jQuery(this).val(''); }).blur(function() { i ...
- ie8下修改input的type属性报错
摘要: 现在有一个需求如图所示,当用户勾选显示明文复选框时,要以明文显示用户输入的密码,去掉勾选时要变回密文,刚开始想到的就是修改输入框的type来决定显示明文还是密文,使用jQuery的attr来做 ...
- js修改input的type属性问题(兼容所有浏览器,主要用于密码类的默认有提示文字的效果)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...
- [Liferay6.2.2]AUI的小坑:input的type属性
<aui:input name="name" label="姓名" value="<%=student.getName() %>&q ...
- html5 input的type属性启动数字输入法
html5 input的type属性启动数字输入法 当文本框只能输入数字是一个很常见的需求,比如电话号码,身份证号,卡号, 数量....等等只允许数字输入,为了更好的用户体验性,直接写出 启动数字 ...
- input的type属性
input的type属性:http://www.w3school.com.cn/tags/att_input_type.asp 基本语法: <input type="hidden&qu ...
- 在vuejs 中使用axios不能获取属性data的解决方法
Laravel5.4 vuejs和axios使用钩子mounted不能获取属性data的解决方法 //出错问题:在then 这个里边的赋值方法this.followed = response.data ...
随机推荐
- 自然数e这家伙怎么蹦跶出来的?
自然数e这家伙怎么蹦跶出来的? 之前看过一篇中文介绍自然数e的blog,引起了我的兴趣 原文是阮一峰大牛(我认为必须很有必要尊敬的称,大牛)嚼烂了吐出来的哈哈,只是我认为还是自己去看原文比較好 感觉非 ...
- JAVA ,SSH中文及其乱码问题的解决 6大配置点 使用UTF-8编码
JSP,mysql,tomcat下(基于struts2)中文及其乱码问题的解决 6大配置点 使用UTF-8编码 目前对遇到J2EE 开发中 中文及其乱码问题,参考网上资料做个总结, 主要是6大配置点: ...
- HDU1159 && POJ1458:Common Subsequence(LCS)
Problem Description A subsequence of a given sequence is the given sequence with some elements (poss ...
- OD: ActiveX Vulnerabilities
通过一个精心构造的页面 exploit 第三方软件中的 ActiveX 已经成为一种惯用攻击手段,众多知名软件公司都曾被发现其注册的 ActiveX 中存在严重的缓冲区溢出漏洞,一个被广泛使用的第三方 ...
- nyoj 36
//这一题是 nyoj 36 是一道求最长公共子序列的题,也是用dp做出来的 核心代码也就是一句,题目大概思路是先找到两组字符串里面相同的字母 在二维数组里面更新每次比较过后dp的值,空想很难理解 ...
- 如何缩减Try{}Catch{}Finally{}代码----定义一个公用的Try{}Catch{}Finally{}
public class Process { public Process() { } public static void Execute(Action action) { try { //ACTI ...
- c - 水仙花数.
#include <stdio.h> #include <math.h> /* *打印出所有的“水仙花数” ,所谓“水仙花数”是指一个三位数,其各位数字立方和等于该数本身. * ...
- 使用三层交换机的ACL实现不同vlan间的隔离
使用三层交换机的ACL实现不同vlan间的隔离 建立三个vlan vlan10 vlan20 vlan30 www.2cto.com PC1 PC3属于vlan10 PC2 PC4属于v ...
- apache添加php支持
在php编译安装好后,需要在apache中添加对php的支持,方法:找到“#AddType application/x-gzip .gz .tgz”并在后面加入AddType application/ ...
- java操作csv文件之javacsv.jar应用
csv文件是分隔文件,如果使用java的io流来写,比较麻烦,这里为大家提供一个javacsv的jar包,这个很方便操作csv文件. 下载地址:https://pan.baidu.com/s/1i46 ...