how to detect if a link was clicked when window.onbeforeunload is triggered?

javascript

Solution

You're looking for deferred event handling. I'll explain using jQuery, as it is less code:

window._link_was_clicked = false;
window.onbeforeunload = function(event) {
  if (window._link_was_clicked) {
    return; // abort beforeunload
  }
  // your event handling
};

jQuery(document).on('click', 'a', function(event) {
  window._link_was_clicked = true;
});

a (very) poor man's implementation without jQuery's convenient delegation handling could look like:

document.addEventListener("click", function(event) {
  if (this.nodeName.toLowerCase() === 'a') {
    window._link_was_clicked = true;
  }
}, true);

this allows all links on your page to leave without invoking the `beforeunload` handler. I'm sure you can figure out how to customize this, should you only want to allow this for a specific set of links (your question wasn't particularly clear on that).

Problem

I have window.onbeforeunload triggering properly. It's displaying a confirmation box to ensure the user knows they are navigating (closing) the window and that any unsaved work will be erased. I have a unique situation where I don't want this to trigger if a user navigates away from the page by clicking a link, but I can't figure out how to detect if a link has been clicked inside the function to halt the function. This is what I have for code: ``` window.onbeforeunload = function() { var message = 'You are leaving the page.'; /* If this is Firefox */ if(/Firefox[\/\s](\d+)/.test(navigator.userAgent) && new Number(RegExp.$1) >= 4) { if(confirm(message)) { history.go(); } else { window.setTimeout(function() { window.stop(); }, 1); } } /* Everything else */ else { return message; } } ```

Original source