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

时间:2015-05-26 10:53:05

标签: javascript jquery html

我的用例是显示一个用于输入信用卡号的文本框,默认情况下应该屏蔽它。然后我会有一个复选框,点击上面的文本框应该取消屏蔽creditCardNumber。

我能够使用jQuery实现这一点,但是每当我选中复选框时,我都会遇到Spring绑定问题。选中复选框时,它没有取最新值。

在更改复选框时,我从就绪函数调用此函数:

    $("#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");
}

1 个答案:

答案 0 :(得分:0)

原因是没有获取该值是因为您正在创建一个全新的对象来替换旧的对象。您所需要的只是:

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

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

如果您只是这样做,它也会起作用:

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