Question

我正在处理一个项目，我需要暂时禁用所有超链接，然后在我的弹出式div消失后再次启用它们。我能够使用我写的这个函数成功禁用所有链接：

    function disableHyperlinks(){
        link_targets = Array();
        var anchors = document.getElementsByTagName("a");
        for(var i = 0; i < anchors.length; i++){
            link_targets.push(anchors[i].href);
            anchors[i].href= "#";
        }
     }

其中还保存了所有网址，以便稍后可以使用此功能将其恢复：

    function enableHyperlinks(){
        var anchors = document.getElementsByTagName("a");
        for(var i = 0; i < anchors.length; i++){
            anchors[i].href= link_targets[i];
        }
    }

上面的代码似乎运行得很好，它会删除所有链接，然后将它们全部放回去，没有任何问题，但问题是如果我运行＆＃39;启用＆＃39;单击链接后的代码，几乎就像javascript将链接设置回原始目标并然后注册点击一样。因此，尽管被禁用了＃39;以这种方式，链接仍然离开页面。

问题已经证明here

点击红色＆＃34; L＆＃34;使用白色背景启用我选择的javascript，你会注意到你带鼠标的任何东西都会有蓝色虚线边框，我需要能够选择＆＃34;选择＆＃34;如果链接也被点击，网页的一部分没有重定向到另一个页面..任何想法我怎么能正确地做到这一点？

（请注意我试图避免使用JQuery）

Answer 1

处理onClick侦听器：

var areEnabled = false;
function toggleLinks(){
    var anchors = document.getElementsByTagName('a');
    for(var i=0; i < anchors.length; i++)
        anchors[i].onclick = (areEnabled) ? null : function(e){ return false };
    areEnabled = !areEnabled;
};

Answer 2

您可以在div的弹出窗口下方创建另一个不可见的z-index，而不是搜索许多链接并禁用它们（BTW，它们无法帮助您对抗其他可点击的对象）将覆盖整个页面并捕获所有点击而不是下面的元素。您甚至可以将其设置为半透明而不是完全不可见，以便视觉效果提醒用户禁用“低级别”。

Answer 3

我终于能够通过操纵每个超链接的onclick属性来解决我自己的问题，然后将其设置回以前的状态。 bokonic响应的唯一问题是onclick属性设置为null以“重新启用”链接，这将禁用链接之前的任何javascript功能。

var onclickEvents;

function disableHyperlinks(){
    onclickEvents = Array();
    var anchors = document.getElementsByTagName("a");
    for(var i = 0; i < anchors.length; i++){
        onclickEvents.push(anchors[i].onclick);
        anchors[i].onclick=function(){return false;};
    }
}

function enableHyperlinks(){
    var anchors = document.getElementsByTagName("a");
    for(var i = 0; i < anchors.length; i++){
        anchors[i].onclick = onclickEvents[i];
    }
}

在JavaScript中启用和禁用超链接

3 个答案: