Question

如何拦截文档中的链接点击？它必须是跨平台的。

我正在寻找类似的东西：

// content is a div with innerHTML
var content = document.getElementById("ControlPanelContent");

content.addEventListener("click", ContentClick, false);

 function ContentClick(event) {

    if(event.href == "http://oldurl")
  {
     event.href = "http://newurl";
  }
}

提前感谢您的帮助。

Answer 1

for (var ls = document.links, numLinks = ls.length, i=0; i<numLinks; i++){
    ls[i].href= "...torture puppies here...";
}

或者，如果您只想拦截而不是更改，请添加onclick处理程序。这将在导航到url之前被调用：

var handler = function(){
    ...torment kittens here...
}
for (var ls = document.links, numLinks = ls.length, i=0; i<numLinks; i++){
    ls[i].onclick= handler;
}

请注意，document.links还包含AREA个href个元素，而不只是A个元素。

Answer 2

在使用页面时生成链接的情况怎么样？对于今天更复杂的前端框架，这种情况经常发生。

正确的解决方案可能是将click事件侦听器放在文档上。这是因为元素上的事件传播给他们的父母，并且因为最顶层的父母实际上对链接起了作用。

这适用于所有链接，无论它们是否已加载页面，还是在任何时间点在前端动态生成。

function interceptClickEvent(e) {
    var href;
    var target = e.target || e.srcElement;
    if (target.tagName === 'A') {
        href = target.getAttribute('href');

        //put your logic here...
        if (true) {

           //tell the browser not to respond to the link click
           e.preventDefault();
        }
    }
}


//listen for link click events at the document level
if (document.addEventListener) {
    document.addEventListener('click', interceptClickEvent);
} else if (document.attachEvent) {
    document.attachEvent('onclick', interceptClickEvent);
}

Answer 3

我刚刚发现了这一点，它可能会帮助一些人。除了拦截，如果你想禁止链接加载另一个页面或重新加载当前页面。只需将href设置为'＃'（如内部页面引用前缀）。现在，您可以使用该链接在停留在同一页面时调用函数。

使用javascript拦截所有文档链接点击

3 个答案: