如何检测 2021 年使用 javascript 关闭的选项卡？

Question

这个最热门的问题有很多答案，但遗憾的是我找不到合适的答案。大多数回复是 10 年前的，有些甚至不起作用：

Detect browser or tab closing

同样的代码也有很多变体（例如，有些在代码中添加“e.returnValue='';”，而其他许多则不添加。

执行此检测的最佳方法是什么？还是beforeunload？代码在 2021 年将如何覆盖现代 browsers/behaviors？

（为了避免 XY 问题，如果用户试图关闭页面，我想显示一个确认弹出窗口。弹出窗口很容易，检测却不容易。）

Answer 1

这是重复的。另一个问题的答案指定了 onunload 和 beforeunload 事件，这两个事件都具有很好的浏览器兼容性 (onunload and beforeunload)。

我在我的浏览器控制台中尝试了 this solution（随机选择），它开箱即用：

window.addEventListener("beforeunload", function (e) {
 var confirmationMessage = "tab close";

 (e || window.event).returnValue = confirmationMessage;     //Gecko + IE
 sendkeylog(confirmationMessage);
 return confirmationMessage;                                //Webkit, Safari, Chrome etc.
});

另外，该问题的答案中有3~4个是2018年之后的！他们怎么会老？！

我最终会编辑答案以包含有关特定页面如何执行此操作的详细信息。

编辑：我检查了页面，唯一检查的是：

$(window).unbind().bind('beforeunload', function(){
  return 'You are about to disconnect from this chat, are you sure you want to leave?';
});

这段代码是逐字记录的，而且很糟糕。正如 @charlietfl 所提到的，bind() 和 unbind() 是不推荐使用的方法。来自文档：

As of jQuery 3.0, .bind() has been deprecated. It was superseded by the .on() method for attaching event handlers to a document since jQuery 1.7, so its use was already discouraged.

所以请改用on()。

如何检测 2021 年使用 javascript 关闭的选项卡？

How to detect tab closing with javascript in 2021?

javascript

jquery

confirm