javascript - 在循环中设置传递给事件监听器的值不起作用

这似乎是一个非常基本的问题，但我似乎找不到答案。我有一个可单击的svg矩形数组，其ID为“ texture-1”，“ texture-2”等。textureInput数组包含这些矩形的getElementById，在单击时调用changeTexture（）函数。我希望在单击“ texture-1”等时将“ 1”传递到changeTexture（）函数中。

手动分配这些值有效：

  textureInput[0].addEventListener('click', function(){changeTexture("0")}, false);
  textureInput[1].addEventListener('click', function(){changeTexture("1")}, false);

但是在循环中做同样的事情不会：

for (var i=0; i<maxTextures; i++){
   textureInput[i].addEventListener('click', function(){changeTexture(i)}
};

它是否在事件时间传入当时的“ i”当前值-循环外未定义？

最佳答案

您需要创建一个闭包，以便创建i变量的新副本，否则它将使用属于for循环的副本。尝试这个：

for (var i=0; i<maxTextures; i++){
  textureInput[i].addEventListener('click', (function(i) {
    return function () {
      changeTexture(i);
    };
  })(i));
};

关于javascript - 在循环中设置传递给事件监听器的值不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/32937981/