"Вы уверены, что хотите оставить?" сообщение по-прежнему появляется, даже если в форму не было внесено никаких изменений

Question

В большинстве случаев приведенный ниже код работает, чтобы убедиться, что он улавливает любые изменения, внесенные в форму, но все еще есть несколько случаев, когда человек переходит на страницу, не вносит никаких изменений в форму, а сообщение все еще всплывает, и я не уверен, почему это сообщение появляется даже при отсутствии изменений. Любая помощь будет принята с благодарностью.

PS - это сказал один из разработчиков, возможно, это поможет, «поэтому проблема в том, что форма не завершает загрузку до того, как она сериализуется и сохраняется. Я добавляю задержку и это устранило проблему, но мы не можем полагаться на это ".

function formUnloadPrompt(formSelector) {
var formA = $(formSelector).serialize(), formB, formSubmit = false;

// Detect Form Submit
$(formSelector).submit( function(){
    formSubmit = false;
});

 $(':submit').click(function() {
        formSubmit = true;
    });

// Handle Form Unload    
window.onbeforeunload = function(){
    if (formSubmit) return;
    formB = $(formSelector).serialize();
    if (formA != formB) return "Your changes have not been saved.";
  };
}

Answer 1

Вы можете проверить, была ли DOM полностью загружена с помощью метода jQueries .ready(). Если вы оберните свой код так, чтобы он запускался только после загрузки всех элементов.

$( document ).ready(function() {
  // your code
});

Альтернативным решением было бы добавить событие onchange в поля ввода и установить флаг, чтобы вы знать, ввел ли пользователь что-либо.

Обычно каждый аспект вашего javascript, который имеет дело с элементами DOM, должен выполняться только после того, как ready сработал.