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

在 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>


杨魅力
浏览 175回答 3
3回答

一只甜甜圈

在某些浏览器中,在此事件期间可能会忽略对 window.alert()、window.confirm() 和 window.prompt() 的调用。有关详细信息,请参阅 HTML 规范。https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event尝试 console.log 并在控制台中选中“保留日志”。你会发现这alert()对你的情况不起作用

ITMISS

为防止诈骗,浏览器会谨慎处理这些消息。大多数人可以做的事情非常有限。Chrome 显示标准化消息“离开网站?您所做的更改可能无法保存。”&nbsp;这是不可改变的afaik。为此,只需使用:&nbsp;&nbsp;window.onbeforeunload&nbsp;=&nbsp;function&nbsp;()&nbsp;{&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;true; &nbsp;&nbsp;&nbsp;&nbsp;};另一种方法是检测鼠标何时离开窗口。这是不一样的,但离开视口通常是在关闭选项卡之前执行的操作。您可以在鼠标离开窗口时检测事件并触发您喜欢的任何消息或弹出窗口。我个人觉得这很烦人。

拉莫斯之舞

您实际上正在正确检测到选项卡关闭事件!问题出在您的触发操作上。来自相关的 MDN 文档:为了防止不需要的弹出窗口,某些浏览器不会显示在beforeunload事件处理程序中创建的提示,除非页面已与之交互。此外,有些根本不显示它们。这意味着您很难在关闭浏览器选项卡之前显示警告消息,就像您说的那样。但是,您可以通过使用return处理程序上的值来实现类似的目的。再次引用文档:当此事件返回(或将 returnValue 属性设置为)null 或 undefined 以外的值时,系统将提示用户确认页面卸载。在旧版浏览器中,事件的返回值显示在此对话框中。从 Firefox 44、Chrome 51、Opera 38 和 Safari 9.1 开始,将显示不受网页控制的通用字符串,而不是返回的字符串。有关更多详细信息,请参阅其他问题Warn user before leaving web page with unsaved changes。
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript