在DOM可能已经改变的情况下，是否有可能“刷新”或“重新运行”jQuery选择器？

Question

在DOM可能已经改变的情况下，是否有可能“刷新”或“重新运行”jQuery选择器？

4

我有一个加载复杂表单的页面，在这组表单中，有密码字段。这些密码字段有显示/隐藏切换开关，当其中任何一个被点击时，所有密码字段都会在DOM中用它们自己的等价物替换，并在"文本"和"密码"之间切换其类型以实现显示/隐藏效果。需要明确的是，原始输入使用replaceWith()被全新地替换成具有相同属性（包括ID）但不同类型属性的新输入。

问题是当切换发生时，我之前在jQuery选择器中定义的全局句柄（例如$('#password_field_id'））不再映射到密码字段。

是否有一种jQuery函数可以在当前DOM中重新选择原始CSS选择器上的元素？以下是用于替换输入的函数：

function TogglePasswordHide()
{
    var show = false;
    if ($('#basic_pass_24').attr('type') == 'password')
    {
        show = true;
    }

    $('input.password_input').each(function()
    {
        var sDisabled = '';
        if ($(this).is(':disabled'))
        {
            sDisabled = 'disabled="disabled"';
        }

        if ( show ) // show the password
        {
            $(this).replaceWith('<input type="text" '+sDisabled+' class="password_input" id="'+$(this).attr('id')+'" value="'+$(this).val()+'">');
            show_password.text('hide');
        }
        else // hide the password
        {
            $(this).replaceWith('<input type="password" '+sDisabled+' class="password_input" id="'+$(this).attr('id')+'" value="'+$(this).val()+'">');
            show_password.text('show');
        }
    });
}

在.each循环中，我是否可以通过某个调用"重载"jquery对象使得相对输入框的全局句柄能够轻松更新自己，而不必为每个元素重新声明具有相同选择器的新jQuery对象并覆盖原始句柄？

- Rimer

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Sampson · Accepted Answer

使用事件委托，在父表单上监听事件：

$("form").on("click", ".password_input", function(event) {
    /* What to do when password input is clicked */
});

由于此事件绑定到表单元素，因此您可以随意添加和删除输入而无需担心丢失事件。

当您单击或执行其中一个密码输入的其他操作时，此事件会冒泡到表单，然后进行评估。如果 .target 与您的选择器匹配（在本示例中为 .password_input），则会调用回调函数，您可以对发生的事件做出反应。