About Confirmation Dialog When Trying to Leave a Form with Unsaved Changes

If you want to prevent unsaved changes in forms, you have a chance to display the browser-native dialog with a default message like:

Leave site?
Changes that you made may not be saved.
[Cancel] [Leave]

Here is the JavaScript you would need with jQuery for a page with the form:

$(function() {
  var showLeaveConfirmation = false;

  $(document).on('change', ':input', function() {
    showLeaveConfirmation = true;
  });

  $(document).on('input', '[contenteditable="true"]', function() {
    showLeaveConfirmation = true;
  });

  $('form').on('submit', function() {
    showLeaveConfirmation = false;
  });

  $(window).on('beforeunload', function(e) {
    if (showLeaveConfirmation) {
      e.preventDefault();
      e.returnValue = "";
      return "";
    }
  });
});