javascript - 在循环中添加 'click' 事件监听器

Question

重构标准onClick在 html 标签内给听众，我的代码遇到问题:

var td;
    for (var t=1;t<8;t++){
        td = document.getElementById('td'+t);
        if (typeof window.addEventListener==='function'){
                td.addEventListener('click',function(){
                    console.log(td);
            })}
 }  

何时 td元素被点击，假设点击了td与循环中的最后一个索引，例如7
看起来像，eventListeners仅填充此循环中的最后一个元素。
循环初始化看起来是正确的。
为什么会这样？

这里是live code

Answer 1

您需要将事件监听器的分配包装在闭包中，例如:

var td;
for (var t = 1; t < 8; t++){
    td = document.getElementById('td'+t);
    if (typeof window.addEventListener === 'function'){
        (function (_td) {
            td.addEventListener('click', function(){
                console.log(_td);
            });
        })(td);
    }
}