在不使用cloneNode的情况下将输入类型从IE中的密码更改为文本

Question

我的用例是显示一个用于输入信用卡号的文本框，默认情况下应将其屏蔽。 然后，我将得到一个复选框，单击上面的文本框可以取消屏蔽creditCardNumber。

我可以使用jQuery来实现此目的，但是，每当选中此复选框时，我都会遇到Spring绑定问题。 选中复选框时，它不会采用最新值。

更改复选框后，我从ready函数调用此函数：

    $("#showCardNumber").change (function(){
        unmaskCreditCardTxtBox($(this)); 
    });


function unmaskCreditCardTxtBox(jqCheckBox){
$("#creditCardNumber").each(
    function(){
        var oldbox = $(this);
        var boxtype = 'password';
        if(checkBoxIsChecked(jqCheckBox)) {
            boxtype = 'text';
        }
        swapCreditCardTextBox(oldbox, boxtype);
    }
);
}



 function swapCreditCardTextBox(oldbox, boxtype){
    var newbox = $("<input></input>");
    newbox.attr('id',oldbox.attr('id'));
    newbox.attr('name',oldbox.attr('name'));
    newbox.attr('type',boxtype);
    newbox.attr('maxlength', oldbox.attr('maxlength'));
    newbox.attr("class", oldbox.attr("class"));
    newbox.val(oldbox.val());
    newbox.attr("className",oldbox.attr("className"));
    oldbox.replaceWith(newbox);
}

function checkBoxIsChecked(jqCheckBox) {
    return jqCheckBox.is(":checked");
}

Answer 1

不采用该值的原因是因为您正在创建一个全新的对象来替换旧的对象。 所有你需要的是：

$('#creditCardNumber').get(0).type = 'text';

您可以在复选框的change事件中处理此问题。

如果您只需执行以下操作，它也将起作用：

$('#creditCardNumber').attr('type', 'text');