Question

我有一个onberforeunload方法，当用户尝试使用以下代码关闭标签页或浏览器时正确提醒用户：

window.onbeforeunload = function(event) {

                event.returnValue = 'Are you sure you want to leave/';
                console.log(event.returnValue);

    };

我发现单击页面上的超链接时未调用onberforeunload。我想显示的警告信息没有出现，页面正在自由加载。

我已经搜索了许多方法来创建弹出窗口，当选择超链接时它们都处理div标签中的一个或多个超链接。如果选择任何超链接，我希望显示一个弹出窗口。

为什么onbeforeunload没有通过超链接捕获页面的退出？我对onbeforeunload的理解是错误的，它应该捕获超链接退出吗？

更新

我已将代码更新为以下内容：

window.onbeforeunload = closeIT;
function closeIT() {
        return 'here';
        if(searchOnGoing){
            return 'Ifs you leave the Youtube History page now the application will not finish';
        }

};

它仍然不适用于超链接以及浏览器和制表符关闭。我将此作为chrome扩展中的内容脚本的一部分运行，该扩展将内容脚本注入页面。这会对它产生影响吗？

我也有一个onunload跟随，我想知道这也会对它产生影响吗？

window.onunload = function(event){
            //Do something
    }

Answer 1

实际上，它应该触发。您是否通过点击事件监听器以某种方式捕获事件？无论如何，您可以在点击事件监听器的帮助下显示警报。以下代码段从类似的问题中复制：how to detect if a link was clicked when window.onbeforeunload is triggered? 相反，问题是如何在单击链接时阻止beforeunload事件。

var link_was_clicked = false;
document.addEventListener("click", function(e) {
  if (e.target.nodeName.toLowerCase() === 'a') {
    link_was_clicked = true;
  }
}, true);

window.onbeforeunload = function() {
  if(link_was_clicked) {
    link_was_clicked = false;
    return;
  }
  //other code here
}

Answer 2

以下代码段正确使用onbeforeunload。

    <body onbeforeunload="return myFunction()">
    
    <a href="google.com">Click me!</a>
          
    <script>
    function myFunction() {
        return "Please don't go!\nThis works beautifully!";
    }
    </script>

通过onberforeunload捕获的超链接页面退出

2 个答案: