2

我正在使用以下代码将侦听器添加到 a（我附加到表中的 TBODY），因此当我将鼠标放在 TR 上时，我可以看到很好的高亮效果。我还有一个“单击”事件，它使整行“可单击”，因此用户可以轻松单击整行并转到该特定页面。

我正在使用 JS，因为我使用 AJAX 调用来填充 TR（以及他们的少数 TD）。

我列表中的前 12 个元素用 PHP 很好地完成了，但之后我通过 Ajax 调用加载了下一个 10、10、10...。

当我使用 PHP 并将 javascript: 添加到带有“onClick”的 TR 时，它可以完美运行，但是在下面的代码（javascript）中，只有 mouseover 和 mouseout 可以正常工作，“click”事件侦听器会添加到所有 window.location.href i 的最后一个值，当前值 (13, 14, 15) 的 insted ......它只加到所有 15 （所以总是 i 的最后一个值 - 我的计数器......它不会像计数器那样增加）。

我认为事件侦听器的功能，它的初始化方式，我不知道的事情有问题。

             for(i=0; i<10; i++){

                    myTr.addEventListener("mouseover",function(){
                        this.style.backgroundColor = "#083636"
                        this.style.cursor = "pointer"
                    });

                    myTr.addEventListener("mouseout",function(){
                        this.style.backgroundColor = "transparent"
                    });

                    myTr.addEventListener("click",function(){
                        window.location.href = '/clubbers/' + clubber_url + '/' + i + '#threads'
                    });

             }

*在输入/复制代码时忘记开始我的for括号，现在看起来不错

4

3 回答 3

1 
function clickTr(i){
    return function(){
        window.location.href = '/clubbers/' + clubber_url + '/' + i + '#threads';
    }
}
for(i=0; i<10; i++){

                myTr.addEventListener("mouseover",function(){
                    this.style.backgroundColor = "#083636"
                    this.style.cursor = "pointer"
                });

                myTr.addEventListener("mouseout",function(){
                    this.style.backgroundColor = "transparent"
                });

                myTr.addEventListener("click",clickTr(i));

         }
于 2013-08-03T18:15:30.887 回答
1

您的问题是事件未正确捕获外部 for 循环中的变量 i ，因为在评估事件时，循环已经完成，并且变量处于其最后一个值。

查看这篇文章以获取一些解决方案：

Javascript 中捕获的变量

于 2013-08-03T18:04:32.533 回答
1

这是一个范围问题。基本上，您将传递i给您的 eventListener，它与循环递增的变量相同。请参阅JavaScript 闭包如何工作？为了更好的解释

你可以这样做：

myTr.addEventListener("click",(function(j){
  return function(e) {
    window.location.href = '/clubbers/' + clubber_url + '/' + j + '#threads'
  }
})(i));
于 2013-08-03T18:05:26.330 回答