Question

我只想了解为什么？

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>close</title>
</head>
<body>
    <h1>onbeforeunload</h1>

<script>
    console.log("loaded");
    window.onbeforeunload = confirmExit;
    function confirmExit(){
        console.log("closed");
        return false;
    }
</script>
</body>
</html>

如果您将此代码复制并保存为.html文件并在浏览器中运行，并且没有在页面内部单击并关闭选项卡或浏览器，则onbeforeunload将不会触发！

但是，如果您在页面内单击一次，然后尝试关闭页面，则它可以正常工作。

Answer 1

这是documented behaviour：

注意：为了避免不必要的弹出窗口，除非页面已与之交互，否则某些浏览器不会显示在beforeunload事件处理程序中创建的提示；有些根本不显示它们。有关特定浏览器的列表，请参见Browser_compatibility部分。

Answer 2

尝试一下：-

$(document).ready(function() { 
    console.log("loaded");
    window.onbeforeunload = confirmExit;
    function confirmExit(){
        console.log("closed");
        return true;
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>onbeforeunload</h1>

如果未单击页面，为什么onbeforeunload不触发？

2 个答案: