循环和函数

Question

我在收集有关单击事件监听器的信息时遇到问题。

我有这个构建数组的循环：

myButtonList = document.getElementsByTagName('a');
myAnchorList = [];

for (i=0; i < myButtonList.length;i++) {
    if (myButtonList[i].getAttribute('class') == 'flagged') {
        myAnchorList.push(myButtonList[i]);
    }
}

对于每个 <a> 放入 myAnchorList 数组，我还创建了另一个数组来存储来自同一标签（类别和其他属性）的其他信息。

这就是我挣扎的地方。我正在尝试设置一个 eventListener，以便在单击 <a> 时将这些信息发回给我。但不知何故，我在循环中创建一个函数（用于 eventListener）这一事实破坏了一切。

for (i=0; i < myAnchorList.length; i++) {
    myAnchorList[i].addEventListener("click", function(i){
        console.log(alpha+' - '+beta[i]+" - "+charlie[i]);
    });
}

我的值要么是 undefined，要么是我单击的每个按钮都相同的其他一些值。 alpha 运行良好，因为它不依赖于循环的任何迭代，但不依赖于其他循环。

有人能看出我做错了什么吗？

Answer 1

您在循环中创建的闭包中的变量 "i" 将始终检索最后一个值 (myAnchorList.length - 1)。您不应该在循环中创建闭包，您可以使用 "factory" 方法来创建闭包。

Answer 2

for (var i = 0; i < myAnchorList.length; i++) {
    (function (i) { //Passes i to your function
        myAnchorList[i].addEventListener("click", function () {
            console.log(alpha+' - '+beta[i]+" - "+charlie[i]);
        });
    })(i);
}

循环和函数

Loop and Functions

javascript

arrays

loops