This question already has answers here:
Javascript infamous Loop issue? [duplicate]
                                
                                    (5个答案)
                                
                        
                                4年前关闭。
            
                    
例如,我有10个从AJAX响应生成的标签:

<a href="#" id="b1">b1</a>
<a href="#" id="b2">b2</a>
<a href="#" id="b3">b3</a>
<a href="#" id="b4">b4</a>
<a href="#" id="b5">b5</a>
<a href="#" id="b6">b6</a>
<a href="#" id="b7">b7</a>
<a href="#" id="b8">b8</a>
<a href="#" id="b9">b9</a>
<a href="#" id="b10">b10</a>


我需要通过循环将onclick事件分配给每个事件:

for(i=1; i<11; i++) {
    document.getElementById("b"+i).onclick=function() {
        alert(i);
    }
}


这是行不通的,它仅将onclick分配给最后一个标签并警告“ 11”。我该如何工作?我宁愿不使用jQuery。

最佳答案

您所有的处理程序都共享相同的i变量。

您需要将每个处理程序放入一个单独的函数中,该函数以i作为参数,以便每个处理程序都有自己的变量:

function handleElement(i) {
    document.getElementById("b"+i).onclick=function() {
        alert(i);
    };
}

for(i=1; i<11; i++)
    handleElement(i);

关于javascript - 如何在Javascript中使用循环生成事件处理程序? ,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/54779500/

10-12 12:33
查看更多