Question

我有一个网站，可以动态生成链接。我想看看我是否可以添加一个onclick事件处理程序来跟踪外部链接。我期待看到具有target =“new”的链接（这意味着我们网站的外部）并添加事件处理程序

html代码

 <a target="new" href="http://twitter.com/cnn">CNN</a>

我试图测试的代码不起作用。让我知道我的代码有什么问题，或者我应该将onclick事件附加到外部链接？

Js代码

var links = document.getElementsByTagName("a");
for (var i=0; <links.length; i++) { 
    if(links[i].target == 'new'){   
        links[i].onclick = function() {
            alert("Added onClick: " + links[i].href);        
        }
    }
}

Answer 1

您可以在onclick功能中使用this并避免关闭问题

var links = document.getElementsByTagName("a");
for (var i=0; i<links.length; i++) { 
    if(links[i].target == 'new'){   
        links[i].onclick = function(){  
            alert("Added onClick: " + this.href);           
        }
    }
}

Answer 2

这里的另一个答案是你应该使用的（使用它），但是值得解决for循环中的闭包问题。

如果要在for循环中创建的闭包中使用为for循环中的每次迭代更改的变量，请定义并调用匿名函数，该函数返回要绑定（绑定？）到onclick事件的函数

var links = document.getElementsByTagName("a");
for (var i=0; i<links.length; i++) { 
    if(links[i].target == 'new'){   
        links[i].onclick =
            function (obj) {
                return function(event) {
                    alert("Added onClick: " + obj.href);        
                }                   
            }(links[i]);
    }
}

由于匿名函数的参数（obj）是按值传递的，因此在for循环的后续迭代中不会改变。返回的函数将拥有自己的对象副本。

当您将函数视为可以传递的对象时，Javascript中的许多内容开始变得有意义。

Answer 3

你对jQuery不利吗？

$("a[target='new']").click(function(){alert($(this).attr("href"));});

解析具有target =“new”的链接并添加onclick事件

3 个答案: