javascript location.href onchange事件侦听器？ [英] javascript location.href onchange event listener?

问题描述

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

I want to show a message whenever you are leaving the page (not an annoying alert, just some html telling you to wait), in thinking about it I'm facing certain difficulties:

• 当用户在
  浏览器中按停止时，取消导航
  操作，我想要消息去$ b

• when the user presses Stop in the browser, cancelling the navigate-away action, I'd like the message to go away.

每当任何链接被点击，消息就会出现。

whenever any link is clicked, the message should appear.

它不应该捕获点击的链接只是打开另一个标签（忽略_blank目标）

it shouldn't capture when the clicked link just opens another tab ( ignore _blank target )

触发事件很简单，只是像

that being said, firing the event is pretty simple, with just something like

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

问题是如果用户取消，则消息不会消失。

the problem being that if the user cancels, the message wouldn't go away.

可能的修复将是：

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

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

但是我想知道是否有一个更干净的方法，就是当用户取消导航（或者它因任何其他原因失败），我可以隐藏消息。

but I wanted to know if there was a cleaner way, that just when the user cancels the navigation (or it fails for any other reason), I can hide the message.

编辑＃2：

我只是注意到，使用上面的代码，在FF中，消息在页面剩余之前不会显示，在这个时候如果用户按下Stop，他会收到about：blank。如果他在此之前按下Stop，则不会显示该消息。这是我想要的。

I just noticed that with the above code, in FF the message isn't displayed until the page is left, at which point if the user presses Stop, he will receive about:blank. If he presses Stop before that, then the message is never displayed. Which is exactly what I wanted.

在Internet Explorer中，消息永远不会显示，我假设是因为IE处理不同的东西。我想知道Chrome中会发生什么？

In internet explorer the message is never displayed, I'm assuming that's because IE handles stuff differently. I wonder what happens in chrome?

推荐答案

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

Here is a solution that works in all browsers. It uses the document.readyState attribute which works in all browsers except early versions FireFox (works in version 3.6.8). If the browser supports the readyState attribute it will check if the readyState is load (browser is going to another page) or is complete (or something else indicating that the page is not going anywhere). If the browser does not support the readyState then it will default to your solution.

(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);
    };
}());

这篇关于javascript location.href onchange事件侦听器？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！