Question

我想将参数（结果集中的字符串）传递给生成链接的onClick函数。

现在我有这个：

for (var i=0; i<response.data.length; i++){
      var attend= document.createElement("a");
      var name = response.data[i].name;
      attend.innerHTML="Add event";
      attend.addEventListener("click", function() {saveEvent(name);}, false);
      document.getElementsByClassName("event")[i].appendChild(attend);
}

这导致我总是得到最后一个元素名称，无论我点击哪个链接。

Answer 1

这是因为围绕name变量创建了一个闭包。这使得变量保存的数据在所有事件处理函数之间共享。您总是看到最后一个元素name的原因是因为它是循环结束后name属性存储在其中的最后一个值。

您需要在每次循环迭代时传递该数据的副本。更改代码以使用 let 而不是var作为变量声明，以便在循环的每次迭代时，name将拥有自己的范围。

关闭可能是一个棘手的概念，让你的头脑。您可以详细了解它们 here 。

for (var i=0; i<response.data.length; i++){
      var attend= document.createElement("a");
      let name = response.data[i].name;
      attend.innerHTML="Add event";
      attend.addEventListener("click", function() {saveEvent(name);}, false);
      document.getElementsByClassName("event")[i].appendChild(attend);
}

除此之外，修改DOM在性能方面已经是一项昂贵的操作。在循环中完成它，只是复合物。你应该在循环中使用 DocumentFragment ，然后在循环完成时只附加一次。

在onclick函数中传递一个值，用于循环生成的元素

1 个答案: