<input />类型转换(jQuery)

Question

我有这个:

<input type="text" value="Enter Password" class="password" />

... onclick/onfocus,我想将输入类型更改为'password'并删除值,如下所示:

<input type="password" value="" class="password" />

这似乎不起作用:

$('input.password').click(function () {
            $(this).attr('type', 'password');
    });

(看到这个问题我为什么要这样做)

---

这有效,但只有一个问题,我需要点击两次才能输入pass字段:

var passField = $("input.password");
        var passFieldNew = passField.clone();
        $('input.password').click(function () {
            passFieldNew.attr("type", "password");
            passFieldNew.attr("value", "");
            passFieldNew.insertBefore(passField);
            passField.remove();
        });

我该如何解决这个问题？

谢谢!

Answer 1

当元素在DOM中时,您无法更改类型attr,但如果您先删除它,则可以.

以下应该工作(测试,但只在萤火虫).将保留密码类,因为它与您再次插入的元素相同.

var $pwd = $('input.password').remove(); // Note, might be better to select on ID
$pwd.attr('type', 'password');
$pwd.val('');
$('#ABC').after($pwd); // Insert it somewhere in the DOM again