Question

我正在向我的网站添加“确认要离开”对话框，并且遇到onbeforeunload事件的奇怪行为。

docs非常清楚：如果您的页面即将被卸载，则调用此事件。当您的eventHandler返回一个字符串时，将要求用户进行确认。根据浏览器的不同，字符串可能会显示给他。

但是在一个小的示例网站中，我注意到beforeunload仅在用户以某种方式与该网站进行交互时才被触发。这是我的测试设置：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
    <script type="text/javascript">
        window.onload = function () {
            $("#placeholder").text("website loaded")
            window.onbeforeunload = function () {
                return "Reloading the page will reset the survey!";
            }
        }
    </script>
</head>

<body>
    <p id='placeholder'></p>
</body>

</html>

在加载窗口时，段落文本会更改，并且会注册beforeunload的eventHandler。如果我将其加载到Firefox中，则该段落将立即更改。

但是，如果我关闭标签或重新加载标签，则无需确认。仅当我单击网站时，才会显示确认对话框。来回切换标签页还不够，仅等待大约10秒钟是不够的。

行为与Chrome相同。

一旦我单击了网站，就会始终要求确认。我可以重点关注另一个选项卡并关闭该示例（通过右键单击并单击“关闭选项卡”），它要求确认。或另一个标签集中，我尝试关闭浏览器，要求确认。

这是怎么回事，如何确保在卸载网站之前始终触发该事件？

这是一个视频：

Answer 1

事件触发，但可能不会显示确认。来自MDN：

注意：为防止不必要的弹出窗口，浏览器可能不会显示提示除非页面已经被创建，否则在beforeunload事件处理程序中创建与之互动，甚至可能根本不显示它们。

Javascript：何时触发onbeforeunload？

1 个答案:

Javascript：何时触发onb​​eforeunload？

1 个答案:

Javascript：何时触发onbeforeunload？