Question

我知道这是一个非常被问到的问题，但请相信我，我没有通过网络找到答案。

我的目的是仅在用户点击关闭（X）按钮时触发消息框。如果用户单击后退/前进按钮，并且如果他使用F5，CTRL + R，......，则用户将继续收到消息框。

我不希望关联任何其他操作而不是窗口关闭按钮单击作为后面，将会有一个会话杀死Ajax。因此，如果用户键入F5按钮，则终止会话是不可接受的。

这是我的代码。有关信息，我知道IE中有一种方法可以检查事件对象clientY，但这在Firefox中不起作用。

$("a").click(function () {
window.onbeforeunload = null;
});

window.onbeforeunload = function (e) {
var closewindowmessage="If you leave this page, your session will be definitely closed.";

  e = e || window.event;
  // For IE and Firefox
  if (e) {
    e.returnValue = closewindowmessage;
  }

  // For Safari
  return closewindowmessage;
};

Answer 1

没有明确的方法来检测页面被卸载的原因/方式。您可以重建您的站点以使用现在非常流行的“锚导航”方法，该方法将数据存储在HTML锚点中，例如http://www.example.com/page#something=something。这至少通常会解决后退/前进按钮的问题，但不能解决用户重新加载页面时的问题。

除此之外，您可以在用户尝试卸载页面之前使用各种 ad hoc 方式跟踪鼠标和键盘操作。例如，您可以跟踪用户何时沿对角线向右拖动鼠标 - 这可能意味着他即将关闭窗口/标签，因此请保留消息。对角线向左 - 这可能意味着他正要点击后退按钮或者可能在地址字段中输入内容。如果你真的很认真，那就研究一下人们如何移动光标并将其与他们即将关闭页面或做“允许”的事情联系起来。然后，在Mac上，关闭按钮位于窗口的上方左侧角落。等等等等。它仍然只是最好的猜测。

您还可以跟踪向上鼠标移动并在浏览器视口中显示一条大红色消息（不是弹出/警报），以便在他甚至考虑离开页面之前警告用户。

跟踪键盘事件更具确定性，但仍需要一些跨浏览器和平台研究。我给你留下了这段代码，我希望它可以作为样板工作。如果按下F5或Apple + R（Mac），它会记录按键并抑制消息。否则，它将显示一条消息，其中包含所有已记录的按键列表。

分析需要测试和扩展;它只在Firefox Mac上测试过。我可以立即指出的一个错误是，如果按Apple + R，R仍然会收到提示，因为第二页实例从未记录Apple键的任何keydown事件 - 仅用于R键。如果用户按下中间的东西，例如Apple + L，R，它也将失败。你可能没问题，只需检查按下的最后一个键是否为R.

<script>
// Create an empty array.
window.keys = [];

// Log every key press
window.onkeydown = function (e) {
  var evt = window.event || e;

  var keyCode = e.keyCode || e.which;

  window.keys.push(keyCode)

}

function analyzeKeyPresses(){
  keys.reverse();   // Reverse the array so it's easier to handle.
  var doBlock = true;

  // Here we only apply certain checks if there are enough keys in the array. Don't want a JS error...
  switch(window.keys.length){
    case 0:
      doBlock = true;  // Redundant. If there are no key presses logged, assume we should prompt the user.
      break;
    default: // Two or more key presses logged.
      if(keys[0] == 82 && keys[1] == 224) doBlock = false;  // User pressed apple+r on a Mac - don't prompt!
      if(keys[0] == 82 && keys[1] == 17)  doBlock = false;  // User pressed ctrl+r on Windovs (untested) - don't prompt!

      // Note: No break! Intentional fall-through! We still want to check for F5!
    case 1:  // One or more key presses logged.
      if(keys[0] == 116) doBlock = false;   // User pressed F5 - don't prompt!
  }

  keys.reverse();   // Un-reverse the array in case we need to use it again. (Easier to read...)
  return doBlock;
}

window.onbeforeunload = function (e) {
  var closewindowmessage=window.keys.join(" ");

  var blockUnload = analyzeKeyPresses();

  if(blockUnload){
    e = e || window.event;
    // For IE and Firefox
    if (e) {
      e.returnValue = closewindowmessage;
    }

    // For Safari
    return closewindowmessage;
  }
};

</script>
<a href="#1">1</a> <a href="#2">2</a>

在Firefox中检测关闭窗口事件

1 个答案: