如何使用javascript检测浏览器选项卡刷新或关闭[重复]答案

【问题标题】：How can I detect browser tab refresh or close using javascript [duplicate]如何使用javascript检测浏览器选项卡刷新或关闭[重复]
【发布时间】：2013-01-23 21:33:21
【问题描述】：

我有一个问题，我有一个javascript 功能，我想在浏览器关闭时使用它，我如何检测到a browser is being closed？

我已经做了一些研究，我得到了像 onunload 或 beforeunload 这样的解决方案，但是当我重新加载页面时这两个功能都在执行，有没有什么解决方案可以区分重新加载和浏览器/标签关闭。

【问题讨论】：

AFAIK 你无法区分这些。
也许你解释一下当浏览器关闭时你的函数会做什么，那么有人可以提供更好的替代解决方案？
实际上我有一个 javascript 函数，当用户单击注销操作时会调用该函数，该操作会在用户注销后从数据库中删除某些行，我想在用户关闭浏览器时调用相同的函数太
如果用户登录我们，您希望从数据库中删除该行中的哪些数据？通常，只需添加一条记录或修改现有记录即可跟踪用户在网站上的活动。
此行包含特定用户的活动

标签： javascript jquery html

【解决方案1】：

不，你不知道，HTML 页面不是浏览器的“所有者”，你只能有限地访问信息，而这些信息不在其中。

您可以知道用户何时离开您的页面，但您不知道为什么，因为这不关您的事...

【讨论】：

then 如何在浏览器标签页关闭时加载某些功能？
@lord_linus，加载什么？浏览器选项卡已关闭...？！
我有一个函数可以从数据库中删除一些行（我正在使用它到一个使用 ajax 的 javascript 函数中），当用户注销或关闭浏览器时我想执行该函数
@lord_linus 你需要每 X 次 ping 一次浏览器，如果说 2X 次服务器没有得到 ping，做你想做的事。我没有看到其他选择。顺便说一句，它又丑又贵，没有其他选择。
这里不是教程站，自己搜索一下，如果不行，再问新问题。

【解决方案2】：

gdoron 是正确的，因为您无法确定用户“离开页面”的原因/方式。在极端情况下，如果单击浏览器的 CLOSE 按钮并触发警报，您也许可以确定 mousedown 事件。但这可能需要跟踪 mousedown 事件的 X 和 Y，这不是一个很好的做事方式。而且我认为您无法准确确定标签是否已关闭。

【讨论】：

【解决方案3】：

答案是，

</head>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript" language="javascript">

var validNavigation = false;

function endSession() {
// Browser or broswer tab is closed
// Do sth here ...
alert("bye");
}

function wireUpEvents() {
/*
* For a list of events that triggers onbeforeunload on IE
* check http://msdn.microsoft.com/en-us/library/ms536907(VS.85).aspx
*/
window.onbeforeunload = function() {
  if (!validNavigation) {
     endSession();
  }
 }

// Attach the event keypress to exclude the F5 refresh
$(document).bind('keypress', function(e) {
if (e.keyCode == 116){
  validNavigation = true;
}
});

// Attach the event click for all links in the page
$("a").bind("click", function() {
validNavigation = true;
});

 // Attach the event submit for all forms in the page
 $("form").bind("submit", function() {
 validNavigation = true;
 });

 // Attach the event click for all inputs in the page
 $("input[type=submit]").bind("click", function() {
 validNavigation = true;
 });

}

// Wire up the events as soon as the DOM tree is ready
$(document).ready(function() {
wireUpEvents();  
}); 
</script>    
</head>
<body>
<h1>Eureka!</h1>
  <a href="http://www.google.com">Google</a>
  <a href="http://www.yahoo.com">Yahoo</a>
</body>
</html>

【讨论】：

如果用户通过点击刷新图标刷新浏览器选项卡怎么办？
实际上并没有解决最初的问题，因为它不会区分关闭和重新加载窗口，尽管这是一个勇敢的努力。