javascript - jQuery - 如果不存在则将更改事件附加到输入元素

Question

下面的代码分为两部分。

1. For each form, Serialize the form and store the serialized value in data attribute of the form itself.
2. For each input element inside form, attach a change event, and then compare the form's serialized value on each change; and then enable/disabled button accordingly.

问题是关于第二部分

我如何检测“更改”事件是否已附加到“输入”元素，如果是，则不再将该事件附加到该元素？

module.trackFormChanges = function (formSelector) {
    $(formSelector)
        .each(function () {
            var theForm = $(this);
            theForm.data('serialized', theForm.serialize());
            var id = theForm.prop("id");
            $("button[form='" + id + "']").prop('disabled', true);
            isFormDirty = false;
        })
        .on('change input', function () {
            var theForm = $(this);
            isFormDirty = !(theForm.serialize() == theForm.data('serialized'));
            var id = theForm.prop("id");
            $("button[form='" + id + "']")
                .prop('disabled', !isFormDirty);
        })
}

Answer 1

您可以像这样检查更改事件是否附加到元素

var foo = $.data( $('YOUR-SELECTOR-HERE').get(0), 'events' ).change

对于您的情况，我建议您向输入添加一个“数据更改”属性。在第一次附加事件时将其设置为真，并在您尝试再次附加事件时再次检查此属性。如果此属性为真，则不再附加该事件。