onclick事件无法处理javascript中的链接

onclick event not working with the links in javascript

本文关键字:链接 javascript 处理 事件 onclick      更新时间:2023-09-26

我是新的2个javascript,我创建了添加onclick事件的函数&对页面中的所有链接调用用户函数但它不能正常工作帮助我解决这个

<script type="text/javascript"> 
  window.onload=function() {  
  var links = document.getElementsByTagName('a');
  for(var i = 0, i<links.length; i++) {
  links[i].onclick = function () {  
  var string = links[i].href; //href value
  var str = string;    
  var spl = string.split("/");   
    switch(spl[2])
    {
        case 'www.google.com':
        var str1 = "http://yahoo.com";
        links[i].target="_blank";
        links[i].href= str1;
        break;
        default:
        links[i].href= string;
    }  
    }
 } 
 }
 </script> 
<a href="http://www.google.com/" target="-blank">www.google.com</a></br>

您有两个问题:

1) for循环中存在语法错误。您需要使用分号而不是逗号

for (var i = 0, i < elements.length; i++) {

for (var i = 0; i < elements.length; i++) {

2) onclick回调引用了i。问题是,你在循环过程中更改了i,但你只在循环完成后才进行onclick回拨。因此,CCD_ 1的值实际上将是CCD_。这意味着i对于您单击的每个单个链接都将是相同的值。因此,如果您有5个链接,则所有链接的i都将为6(6是for循环的第一个中断值)

这里需要记住的重要一点是稍后调用onclick,并且在此之前更新i。为了解决这个问题,您可以在定义onclick函数时捕获i的值,如下所示:

window.onload = function () {
    var elements = document.getElementsByTagName('a');
    for (var i = 0; i < elements.length; i++) {
        (function(index){ 
            elements[index].onclick = function () {
            var string = elements[index].href; //href value
            var str = string;
            var spl = string.split("/");
            switch (spl[2]) {
            case 'www.google.com':
                var str1 = "http://yahoo.com";
                elements[index].target = "_blank";
                elements[index].href = str1;
                break;
            default:
                elements[index].href = string;
            }
        }
        })(i);
    }
}