0

当我在javascript中执行onclick函数时得到负值

  function sun()
        {
            var d,i;
            var t = document.getElementById("table");
            var rows = t.getElementsByTagName("tr");
            for (i = 0; i < rows.length; i++) {
               console.log("inside............." + i);
               rows[i].onclick = function() {
               d = (this.rowIndex);
               console.log(d);
            };
          }
      }
4

1 回答 1

1

虽然我不确定是什么导致了您注意到的确切问题，但您在这里遇到了一个非常常见的 JavaScript 陷阱，即在循环内使用闭包（匿名函数）。与许多其他支持函数式编程的语言一样，JavaScript 具有方便的属性，即函数可以在创建时围绕对它们可见的任何变量“关闭范围”。因此，正如您在那里所做的那样，您可以在函数中使用d(or i) 的值，只要在声明函数时它可以看到它们。

但是，循环内部发生了一些有趣的事情：您在循环中创建的每个函数都共享相同的范围，这意味着它们都共享完全相同d的and副本i。因此，当您单击任何行时，d和iused 的值将是它们在循环结束时的值，而不是您所针对的特定迭代。

这通常使用称为“生成器模式”的东西来解决，您可以在其中创建一个单独的函数，该函数返回在所需范围内关闭的新函数。例如，在您的代码中，您可能会执行类似的操作

function generateClickHandler(i, d) {
    return function() {
        d = (this.rowIndex);
        console.log(d);
    };
}

function sun()
{
    var d,i;
    var t = document.getElementById("table");
    var rows = t.getElementsByTagName("tr");
    for (i = 0; i < rows.length; i++) {
        console.log("inside............." + i);
        rows[i].onclick = generateClickHandler(i, d);
    }
}

新函数generateClickHandler返回一个函数本身，但这里要注意的重要一点是，返回的函数关闭了本地参数 i，而不是循环中使用d的共享值i和值——当你调用它们时，它们的值会被复制。这样，您的代码就不会受到奇怪的关闭效果的影响。dgenerateClickHandler

于 2013-10-25T17:00:22.030 回答