为了账号安全,请及时绑定邮箱和手机立即绑定

如何在javascript中检测浏览器选项卡关闭事件

如何在javascript中检测浏览器选项卡关闭事件

杨魅力 2022-12-22 10:08:26
在 chrome 浏览器中单击关闭选项卡图标时尝试调用浏览器选项卡关闭事件但不起作用。我想在关闭浏览器选项卡之前显示警告消息。怎么做?下面的代码不起作用:<!DOCTYPE html><html><head>    <title>Page Title</title>    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script></head><script type="text/javascript">    window.onbeforeunload = function(evt) {        var message = "Are you sure?";         /* InternetExplorer/Firefox*/        var e = evt || window.event        e.returnValue = message         /* WebKit browser */        return message;    }</script><body>     <h1>This is a Heading</h1>    <p>This is a paragraph.</p> </body> </html>
查看完整描述

3 回答

?
一只甜甜圈

TA贡献1836条经验 获得超5个赞

在某些浏览器中,在此事件期间可能会忽略对 window.alert()、window.confirm() 和 window.prompt() 的调用。有关详细信息,请参阅 HTML 规范。

https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event

尝试 console.log 并在控制台中选中“保留日志”。你会发现这alert()对你的情况不起作用


查看完整回答
反对 回复 2022-12-22
?
ITMISS

TA贡献1871条经验 获得超8个赞

为防止诈骗,浏览器会谨慎处理这些消息。大多数人可以做的事情非常有限。Chrome 显示标准化消息“离开网站?您所做的更改可能无法保存。” 这是不可改变的afaik。为此,只需使用:

  window.onbeforeunload = function () {  
        return true;
    };

另一种方法是检测鼠标何时离开窗口。这是不一样的,但离开视口通常是在关闭选项卡之前执行的操作。您可以在鼠标离开窗口时检测事件并触发您喜欢的任何消息或弹出窗口。我个人觉得这很烦人。


查看完整回答
反对 回复 2022-12-22
?
拉莫斯之舞

TA贡献1820条经验 获得超10个赞

您实际上正在正确检测到选项卡关闭事件!问题出在您的触发操作上。来自相关的 MDN 文档

为了防止不需要的弹出窗口,某些浏览器不会显示在beforeunload事件处理程序中创建的提示,除非页面已与之交互。此外,有些根本不显示它们。

这意味着您很难在关闭浏览器选项卡之前显示警告消息,就像您说的那样。但是,您可以通过使用return处理程序上的值来实现类似的目的。再次引用文档:

当此事件返回(或将 returnValue 属性设置为)null 或 undefined 以外的值时,系统将提示用户确认页面卸载。在旧版浏览器中,事件的返回值显示在此对话框中。从 Firefox 44、Chrome 51、Opera 38 和 Safari 9.1 开始,将显示不受网页控制的通用字符串,而不是返回的字符串。

有关更多详细信息,请参阅其他问题Warn user before leaving web page with unsaved changes


查看完整回答
反对 回复 2022-12-22
  • 3 回答
  • 0 关注
  • 136 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号