如果通过单击锚点进行重定向，则停止重定向页面

Question

我想防止页面重定向我知道可以通过这个来实现

window.onbeforeunload = function() {
        return "Dude, are you sure you want to leave? Think of the kittens!";
}

这里回答了Prevent any form of page refresh using jQuery/Javascript

但在我的情况下，我只想通过单击任何锚标记来阻止页面重定向。

在我点击锚标记时event.preventDefault() 也不起作用，因为所有锚都没有重定向页面，所以它应该可以正常工作。

如果通过单击锚点进行重定向，我只想停止重定向页面。有什么解决办法吗？

Answer 1

如果点击链接，调用者将为空：

window.onbeforeunload = function() {
    alert(window.onbeforeunload.caller)    
}

Answer 2

你可以保留一个标志，告诉你用户是否点击了a标签，然后在你的onbeforeunload脚本上阅读：

window.onbeforeunload = function () {
    if (_clickedAnchor) {
        _clickedAnchor = false;
        return "Dude, are you sure you want to leave? Think of the kittens!";
    }
}

_clickedAnchor = false;

jQuery(document).ready(function () {
    jQuery("a").click(function () {
        _clickedAnchor = true;
    });
});

Answer 3

因此，既然您标记了 jQuery，我将以此为依据提出我的解决方案。您可以抓取所有 a 标签，然后检查以确保锚点是重定向，然后使用 e.preventDefault();

$('a').on('click',function(e){
    if ($(this).attr('href') != window.location.href)
    {
       e.preventDefault();
       //do stuff
    }
});

Answer 4

您可以使用onhashchange。

使用 jQuery：

$(window).on('hashchange', function() {
    alert('bye byee?');
});

纯 DOM JavaScript：

window.onhashchange = function() {
    alert('bye byee?');
};

注意：您需要为不支持此事件的旧浏览器创建自定义“哈希更改”处理程序。

您可以使用setInterval 轻松执行此操作，并检测document.location.hash 中的任何更改。

---

Failsafe onhashchange 用于旧版浏览器：

var currentHash = document.location.hash;

window.prototype.onhashchange = function( callback ) {
    if(typeof(callback) == 'function') {
        setInterval(function() {
            if(document.location.hash !== currentHash) {
                callback();
            }
        }, 650); // more than a half-a-second delay
    }
}

您可以将其用作常规 DOM 约定中的事件。