6

我有 window.onbeforeunload 正确触发。它显示一个确认框，以确保用户知道他们正在导航（关闭）窗口，并且任何未保存的工作都将被删除。

我有一个独特的情况，如果用户通过单击链接离开页面，我不希望触发此事件，但我不知道如何检测是否在函数内部单击了链接以停止函数. 这就是我的代码：

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;
}
}
4

3 回答 3

7

您正在寻找延迟事件处理。我将使用 jQuery 进行解释，因为它的代码更少：

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;
});

一个没有 jQuery 方便的委托处理的（非常）穷人的实现可能看起来像：

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

这允许您页面上的所有链接在不调用beforeunload处理程序的情况下离开。我相信您可以弄清楚如何自定义它，如果您只想为一组特定的链接允许这个（您的问题不是特别清楚）。

于 2013-03-07T17:33:33.207 回答
5 
var link_was_clicked = false;
document.addEventListener("click", function(e) {
  if (e.target.nodeName.toLowerCase() === 'a') {
    link_was_clicked = true;
  }
}, true);

window.onbeforeunload = function() {
  if(link_was_clicked) {
    link_was_clicked = false;
    return;
  }
  //other code here
}
于 2013-03-09T16:46:15.280 回答
1

您可以使用计时器来区分 alink unload或 a s。reload/user entering a different address unload这样你就知道beforeunload点击链接后直接触发了。

使用 jQuery 的示例：

$('a').on('click', function(){
  window.last_clicked_time = new Date().getTime();
  window.last_clicked = $(this);
});

$(window).bind('beforeunload', function() {
  var time_now = new Date().getTime();
  var link_clicked = window.last_clicked != undefined;
  var within_click_offset = (time_now - window.last_clicked_time) < 100;

  if (link_clicked && within_click_offset) {
    return 'You clicked a link to '+window.last_clicked[0].href+'!';
  } else {
    return 'You are leaving or reloading the page!';
  }
});

（在 Chrome 中测试）

于 2014-07-30T13:18:25.140 回答