javascript - 在 JavaScript 中启用和禁用超链接

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= "#";
        }
     }

它还会保存所有 URL，以便稍后使用这个函数将它们放回:

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

上面的代码似乎工作得很好，它删除了所有链接，然后将它们全部放回去，没有任何问题，但问题是，如果我在单击链接后运行“启用”代码，它几乎就像如果 JavaScript 将链接设置回原始目的地，然后注册点击。因此，尽管以这种方式“禁用”，链接最终仍然会离开页面。

问题演示here

单击带有白色背景的红色“L”以启用我为选择所做的JavaScript，您会注意到将鼠标移到上方的任何内容都会出现蓝色虚线边框，我需要能够“选择”的部分如果还单击了链接，则该网页不会重定向到另一个页面..知道如何正确执行此操作吗？

(请注意，我试图避免使用 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;
};