javascript location.href onchange 事件监听器？

Question

我想在你离开页面时显示一条消息（不是一个烦人的警报，只是一些告诉你等待的html），在考虑它时我面临着某些困难：

• 当用户在 浏览器，取消导航离开 行动，我想要发送消息 离开。

• 每当单击任何链接时，都会出现该消息。

• 当单击的链接刚刚打开另一个选项卡（忽略_blank目标）时，它不应该捕获

，它不应该捕获，即触发事件非常简单，问题是

$(document).unload(function()
{
    // display message
});

如果用户取消，消息不会消失。

一个可能的解决方法是：

$(window).unload(function()
{
    // display message

    setTimeout(function()
    {
        // hide message
    },5000);
});

但我想知道是否有更干净的方法，即当用户取消导航（或由于任何其他原因失败）时，我可以隐藏该消息。

编辑#2：

我刚刚注意到，使用上面的代码，在 FF 中，直到离开页面才会显示消息，此时如果用户按“停止”，他将收到 about:blank。如果他在此之前按“停止”，则永远不会显示该消息。这正是我想要的。

在 Internet Explorer 中，该消息永远不会显示，我假设这是因为 IE 处理内容的方式不同。我想知道 chrome 中会发生什么？

Answer 1

对于第一点：

当用户在浏览器中按“停止”取消导航离开操作时，我希望该消息消失。

不久前我有同样的问题，并且得到了响亮的回应 -我随后的研究也支持了这一点——这是不可能的。一旦开始请求新页面，就不可能以编程方式可靠地“返回”。暂停确实可能是唯一的出路。

不过，其他两点应该相对简单：遍历每个链接（例如使用 jQuery），并添加一个打开确认窗口的 click 事件，并返回 false这样原始的 href 就不会打开。仅针对内部链接执行此操作应该相对容易（检查 target 属性，如果它是 _blank，则保留该链接。）

这可能会变得很难处理不过，链接已经具有点击事件，以及导致不同页面（例如表单提交）的其他事件。

Answer 2

这是一个适用于所有浏览器的解决方案。它使用 document.readyState 属性，该属性适用于除早期版本 FireFox 之外的所有浏览器（适用于版本 3.6.8)。如果浏览器支持readyState属性，它将检查readyState是否已加载（浏览器将转到另一个页面）或已完成（或表明该页面不会转到任何地方的其他内容）。如果浏览器不支持readyState，那么它将默认为您的解决方案。

(function(){
    var hideMessage=document.readyState?function(){
        setTimeout(function(){
            if(document.readyState=='loading'){
                hideMessage();
            }else{
                //hide message
            }
        },500);
    }:function(){
        // hide message
    }
    function displayMessage(){
        // display message
    }
    window.onbeforeunload=function(){
        displayMessage();
        setTimeout(hideMessage,document.readyState?10:5000);
    };
}());