1

我有一个 Web 表单，我将 beforeunload 事件绑定到窗口，以检测表单的任何更改，除了我不需要包含的输入。例如，我不需要绑定 beforeunload 事件的输入。它应该只绑定在离开窗口时会影响丢失更改的输入。

这是我当前的绑定：

formChanged = false;
$('#main-form').on('change.form_change', 'input:not(.leave-change-allowed), textarea:not(.leave-change-allowed), select:not(.leave-change-allowed)', function()
{
    if(!formChanged)
    {
        formChanged = true;

        $(window).bind('beforeunload', function()
        {
            if(formChanged)
            {
                return 'Are you sure you want to navigate away from this window, you will lose unsaved changes.';
            }
        });
    }
    else
    {
        $(this).unbind('change.form_change');   
    }
});

如您所见，我已将:not(.leave-change-allowed)元素包含在选择器中，以逗号分隔以选择表单元素。虽然，我不想将 添加not()到选择器，因为我想添加到 的选择器可能很少，not()但我需要应用到每个表单输入input和。请记住，这些元素是动态的，所以我使用而不是.textareaselect.on().change()

如何将.not()函数与动态元素链接？所以我保持选择器完好无损，并在.not()函数中传递所有不必要的元素？

4

1 回答 1

3

检查函数内类的目标：

formChanged = false;
$('#main-form').on('change.form_change', 'input, textarea, select', function(e) {
    if(! (formChanged || $(e.target).is('.leave-change-allowed')) ) {
        formChanged = true;
        $(window).on('beforeunload', function() {
            if(formChanged) {
                return 'Are you sure you want to navigate away from this window, you will lose unsaved changes.';
            }
        });
    } else {
        $(this).off('change.form_change');   
    }
});
于 2013-03-20T22:21:14.327 回答