How to display onbeforeunload dialog when appropriate?

You can do something like this:

var unsavedChanges = false;
window.onbeforeunload = function() {
  if (unsavedChanges) return 'You have unsaved changes!';
}

function makeSomeChange() {
  // do some changes....
  unsavedChanges = true;
}

You can make sure to change unsavedChanges in the ‘change’ event handlers.