记录一下成长的历程吧!

刚开始写,没什么文笔,也没什么技术含量,可能主要的是纪录一下平常工作学习中遇到的问题,以及解决的办法吧。或者只有问题,没有解决办法。

前两天项目中遇到的一个问题,由于之前一直没有在ie浏览器校验过登陆密码,所以一直没遇到过。

问题描述:

由于placeholder是html5的新属性,只有支持了html5的浏览器才支持placeholder,目前最新的firefox、chrome、safari以及ie10都支持,ie6到ie9都不支持。

所以在IE6-9上面如果是密码输入框的话,并且有类似于“请输入密码”这样的占位符提示的话,就需要将input属性type在text和password之间不停的来回切换。

但是在jquery中,“type属性是 read/write-once 的,只在初始化时set”,所以无法通过$(ele).attr(‘type’, ‘password’)来修改,那么原生js呢?依然是在ie下不支持document.getElementById(id).type = ‘password’,所以原则上就只能逼迫换个思路来解决问题。

页面中写入两个input,

<input type="password" data-holder="密码" style="display:none;">

<input type="text" value="密码" data-holder="密码">

初始化时,将type=password的input隐藏,当获取input[type=’text’]焦点时,将自己隐藏,显示type=password的input,并获取焦点,失去焦点时,进行相反的过程。直接上代码。

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. [Liferay6.2.2]AUI的小坑:input的type属性

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

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

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

  7. input的type属性

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

  8. JQ无法修改input的type属性的替代解决方法

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

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

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

随机推荐

  1. 找规律 SGU 126 Boxes

    题目地址:http://acm.sgu.ru/problem.php?contest=0&problem=126 /* 找规律,智商不够,看了题解 详细解释:http://blog.csdn. ...

  2. CSS3 选择器——伪类选择器

    前面花了两节内容分别在<CSS3选择器——基本选择器>和<CSS3选择器——属性选择器>介绍了CSS3选择器中的基本选择器和属性选择器使用方法,今天要和大家一起学习CSS3选择 ...

  3. Linq To Objects

    一.什么是Linq To Objects 从根本上说,Linq To Objects表示一种新的处理集合的方法.采用旧方法,必须编写指定如何从集合检索数据的复杂的foreach循环.而采用Linq方法 ...

  4. SSH整合JBPM4.4

    第一步:导入所需jar包: 所需的jar包(使用了hibernate annotation和struts2的convention-plugin,可能有多余的包,没做清理): 第二步:修改jbpm配置文 ...

  5. mysql安装后的配置

    mysql的安装其实就是一步一步按提示就可以: 1.开始安装 2.选择mysql安装位置 3.选择数据库存放位置,最好和mysql安装在一起,好查找 4.选择详细设置 5.选开发者机器 6.选多功能型 ...

  6. 暑假训练round2 D: 好序列(Manacher)

    Problem 1061: 好序列 Time Limits:  1000 MS   Memory Limits:  65536 KB 64-bit interger IO format:  %lld  ...

  7. 利用Java针对MySql封装的jdbc框架类 JdbcUtils 完整实现(包含增删改查、JavaBean反射原理,附源码)

    最近看老罗的视频,跟着完成了利用Java操作MySql数据库的一个框架类JdbcUtils.java,完成对数据库的增删改查.其中查询这块,包括普通的查询和利用反射完成的查询,主要包括以下几个函数接口 ...

  8. [ZZ] HDR&ToneMapping

    http://blog.csdn.net/toughbro/article/details/6745207 float游戏存储照片blogimage HDR high dynamic range. 很 ...

  9. PHP 开启短标签

    <?=STATIC_URL?> 让上面的语句可以正常运行,等同于下面的语句 <?php echo STATIC_URL;?> 可以在 php.ini 中找到 short_ope ...

  10. 【翻译】Kinect v2程序设计(C++) Color篇

    Kinect SDK v2预览版,获取数据的基本流程的说明.以及取得Color图像的示例程序的介绍. 上一节,是关于当前型号Kinect for Windows(后面称作Kinect v1)和次世代型 ...