jQuery: Window.OnBeforeUnload Warnung anzeigen außer wenn Submit-Button geklickt wurde

Mit Window.OnBeforeUnload ist es möglich dem Nutzer eine Warnung anzuzeigen, wenn er dabei ist, die Seite zu verlassen. Window.OnBeforeUnload wird aktiv, wenn man den Browser oder den Tab schließt, aber auch wenn man den Submit-Button eines Formulars klickt und eigentlich nicht die Gefahr besteht, dass Eingaben des Benutzers verloren gehen.

Aus diesem Grund möchte ich euch heute zeigen, wie ihr die Window.OnBeforeUnload-Warnung nur dann anzeigen lassen könnt, wenn nicht der Submit-Button geklickt wurde:

var submitted = false;

$(document).ready(function() {
  $("form").submit(function() {
    submitted = true;
  });

  window.onbeforeunload = function () {
    if (!submitted) {
      return 'Möchten Sie die Seite wirklich verlassen?';
    }
  }
});

Die Variable "submitted" soll uns anzeigen, ob der Submit-Button bereits geklickt wurde. Zu Beginn setzen wir die Variable entsprechend auf "false".

In dem Moment, wo wir einen Submit-Button einer Form klicken, setzen wir "submitted" auf "true" um dann in der window.onbeforeunload-Funktion nur im gegenteiligen Fall die Warnung anzeigen zu lassen.