密码字段的jQuery交换文本字段在IE8中不起作用

时间:2011-11-30 18:06:19

标签: javascript jquery forms

在我的Web应用程序的登录表单中,我使用jQuery在获得焦点后将文本字段交换为密码字段。除了IE8之外,它在任何地方都有效(我假设,下面 - 虽然我没有检查过。)

var originalField = $(this);          // Original field
var newField = $(this).clone();       // New field, cloned from the old one
newField.attr("type", "password");    // Change the new field's type to password
newField.insertBefore(originalField); // Insert the new field
originalField.remove();               // Remove the old one
newField.attr("id", "password");      // Give new field the id "password" (for CSS)
newField.select();                    // Bring focus to the new field

思想?

编辑:抱歉,我没有指定,但在IE中“不工作”意味着该字段根本没有被替换。当我在IE中输入密码字段时,我可以阅读其内容。

编辑2:以下是HTML和JS的小提琴:http://jsfiddle.net/franktisellano/v5D9W/3/

1 个答案:

答案 0 :(得分:0)

IE8不允许您更改输入的类型。您在开发工具Error: This command is not supported.<input class="custom" title=Password value="" type=password name=password placeholder="Password">中收到类似错误。

jquery.placeholder插件通过创建新元素并从旧元素复制属性来解决此问题。

function extractAttributes(elem) {
    var attr = elem.attributes, copy = {}, skip = /^jQuery\d+/;
    for(var i = 0; i < attr.length; i++) {
        if(attr[i].specified && !skip.test(attr[i].name)) {
            copy[attr[i].name] = attr[i].value;
        }
    }
    return copy;
}

$clone = $('<input/>')
  .attr($.extend(extractAttributes(this), {type: 'text', value: placeholder, 'data-password': 1, id: cid}))
  .addClass('placeholder');

https://github.com/matoilic/jquery.placeholder/blob/master/jquery.placeholder.js#L80-L82