javascript - 将 html 元素从节点列表传递到匿名函数时遇到困难

Question

这个问题已经有答案了:

JavaScript closure inside loops – simple practical example (45 个回答)

已关闭 6 年前。

我试图将事件监听器添加到节点列表中的每个 html 元素，并将相同的 html 元素作为参数传递给回调函数。我的代码看起来像这样。

let programs = document.getElementsByClassName('program-name')
for (i = 0; i < programs.length; i++){
    programs[i].addEventListener("click", () => testFunc(programs[i]))
}
function testFunc(program) {
    console.log(program)
}

问题是我期待 console.log(program)将 html 元素记录到控制台，但是所有日志都是 undefined

Answer 1

您可以使用传递给处理程序的 event 对象，而不是使用闭包(如评论中建议的那样):

programs[i].addEventListener("click", (evt) => testFunc(evt.currentTarget))

然后，被单击的 HTML 元素将被传递给回调。