如何在javascript或jquery中跟踪浏览器刷新/返回/选项卡关闭和浏览器关闭事件

How to track browser refresh/back/tab close and browser close event in javascript or jquery

本文关键字：浏览器 选项 事件 返回 javascript jquery 跟踪 刷新      更新时间：2023-09-26

我正在使用onbeforeunload函数。当任何一次点击浏览器后退按钮、浏览器刷新按钮、浏览器选项卡关闭按钮和浏览器关闭按钮时，我都想提醒不同的消息。那么我如何跟踪onbeforeUnload函数中的所有事件呢。

我的代码结构就像

<body  onbeforeunload="return closePage();">
<script type="text/javascript">    
function closePage() {
  if(back button click){
    alert("back button");
  } else if(refresh button click || f5){
    alert("refresh button click");
  } else if(browser tab close){
    alert("tab close");
  } else {
    alert("browser closed");
  }
}
</script>

有什么办法解决这个问题吗？非常感谢。

据我所知，你想要的是不可能的。出于安全考虑，大多数浏览器都不允许出现这种情况。

然而，你可以抓住一些东西。类似于f5密钥上的keydown。这样，如果你愿意的话，你可以在"onbeforeunload"函数运行之前在那里做一些事情。

但是，例如，您不能在"后退"按钮上绑定事件。或者"ctrl+r"。

所以我担心你将不得不重新考虑你的选择，并采取其他解决方案。

在客户关闭选项卡之前，您可以做一些小事。javascript检测浏览器关闭选项卡/关闭浏览器，但如果您的操作列表很大，并且选项卡在完成之前关闭，您将束手无策。你可以尝试一下，但以我的经验，这并不依赖于它

window.addEventListener("beforeunload", function (e) {
  var confirmationMessage = "'o/";
  /* Do you small action code here */
  (e || window.event).returnValue = confirmationMessage; //Gecko + IE
  return confirmationMessage;                            //Webkit, Safari, Chrome
});

https://developer.mozilla.org/en-US/docs/Web/Reference/Events/beforeunload?redirectlocale=en-美国&redirectslug=DOM/Mozilla_event_reference/加载之前

非常感谢您的回复。但我发现了一些代码

 if(window.event){
               if (window.event.clientX < 40 && window.event.clientY < 0)
                 {
                    alert("Backbutton is clicked");
                 }
                 else
                 { 
                  return exitPage(); 
                }
            }
    else{
      if(event.currentTarget.performance.navigation.type == 2)
      {
          alert("Back button click in mozilla");
      }
      if(event.currentTarget.performance.navigation.type == 1)
      {
        return exitPage();
      }
}

使用此代码，我可以跟踪后退按钮事件，但它仅在IE 中工作

相关文章：