Question

感谢您的帮助。我想对特定的函数执行多个AddEventListener，但结果不是我想要的。我总是得到名单上的最后一个孩子。

为什么？

这是代码：

第一部分：

<script>  
    var inside_elm= new Array();
    inside_elm[1]="inside_e1";
    inside_elm[2]="inside_e2";
    inside_elm[3]="inside_e3";

    var kk = {      
        showBox :function(elm){
            alert(elm);
            document.getElementById(elm).style.display='block';
        }
    }

    function load() {
        var e_elm= new Array();
        e_elm[1]="e1";
        e_elm[2]="e2";
        e_elm[3]="e3";

        for(var i=1;i<3;i++){
            var k=e_elm[i];
            alert(inside_elm[i]);

            document.getElementById(e_elm[i]).addEventListener('click',function(){kk.showBox(inside_elm[i])},false);
        }
    }
    </script>

身体：

  <body onload="load();">
    <div id="e1">
        e1
        <div id="inside_e1" style="display:none;">inside_e1</div>
    </div>

    <div id="e2">
        e2
        <div id="inside_e2" style="display:none;">inside_e2</div>
    </div>
    <div id="e3">
        e3
        <div id="inside_e3" style="display:none;">inside_e3</div>
    </div>

Answer 1

我认为这取决于以下情况，或者至少它无济于事。

for(i = 1;i < 3;i++){
....
}

只访问数组的前两个原子，并在第三次迭代之前退出循环。尝试

for(i = 1;i < 4;i++){
....
}

同样，优良作法是在0处启动数组索引，在这种情况下

for(i = 0;i<3;i++){
....
}

将迭代每个（假设起始索引为0）

Answer 2

这基本上是因为它在函数执行之前不评估'i'，在哪个阶段它被设置为3。

您想要做的是使用以下内容：

for(var i=1;i<4;i++){
    var k=e_elm[i];
    alert(inside_elm[i]);

    var elm = document.getElementById(e_elm[i]);
    elm.inside_elm = inside_elm[i];
    elm.addEventListener('click', function(){kk.showBox(this.inside_elm)},false);
}

将multi addEventListener添加到特定函数

2 个答案: