Question

我正试图让一个大表的每个tr在点击其中一个td内切换一个div，这就是我所做的：

for( i = 2 ; i < trLen; i++ ){
   var id = $("td.idout", "tr:eq(" + i + ")").text();
   $("tr:has(div#" + id + ")").click(function(){
       $("div #"+ id).toggle();
   });
}

我将每个div的id与条目相同（在上面var id引用的选择中输出）。我测试了每个选项，它们都很完美。我的逻辑肯定有问题，因为它不起作用。它完全没有做任何事情。

Answer 1

div和#符号之间存在冗余空格，而不是选择具有特定id的div，而是在div中选择id的元素：

尝试改变：

$("div #"+ id).toggle();

使用：

$("div#"+ id).toggle(); // or $("#"+ id).toggle()

Answer 2

var keyword声明函数范围的变量，与您可能期望的块范围相反。因此，id循环的每次迭代只共有1 for个click。并且，由于在循环结束后将调用id函数，...function(){ $("div#"+ id).toggle(); }...将始终具有此选择器的循环中的最后一个值：

for( i = 2 ; i < trLen; i++ ) {
    (function () {
        var id = $("td.idout", "tr:eq(" + i + ")").text();
        ...
    })();
}

您可以使用立即调用的函数来解决此问题，该函数将enclose每次迭代的变量：

for( i = 2 ; i < trLen; i++ ) {
    let id = $("td.idout", "tr:eq(" + i + ")").text();
    ...
}

或者，eventually，您将能够使用let keyword代替：

{{1}}

为什么我不能让每个tr标签的事件起作用？

2 个答案: