具有动态生成参数的Javascript函数

Question

下面的代码：

 loop(n times)
    create HTML Button Element
    count++;
    assign onclick event = function(){
                            openSomething("Value_"+count)
                            }

因此，如果我创建3个输入元素（n = 3），然后返回单击三个按钮中的任何一个，则每次只调用openSomething（“ Value _” + 3）。

为什么未调用openSomething（“ Value _” + 1）和openSomething（“ Value _” + 2）？

我不确定发生了什么，可能是范围问题，但是我对范围也不太了解，非常感谢能帮助我朝正确方向发展的任何帮助。

我的原始密码

var count = 0;
   for(var i =0;i<someValue;i++){
        count++;               
        var button = document.createElement("img");
        button.src = "/images/small_button.gif";
        button.imageButton = true;
        button.srcBase = "/images/small_button";
        button.onclick = function () {
                       selectSomething("someIdText_"+count);};            
                       cell.appendChild(button);

    }

Answer 1

由于JavaScript没有变量的块级作用域，因此所有内容都作用于该函数。 这意味着，当您在以后的某个时刻（即函数完全执行后）使用了变量（例如循环计数器n或count变量）的代码时，它将其值设置为循环的最后一个值。 您需要在循环内部创建一个闭包（变量的新作用域）。 这样的事情（因为您没有发布实际的代码）：

for(var i = 0, l = list.length; i < l; i++) {
    (function(count) {
        something.onclick = function() {
            openSomething("Value_" + count);
        }
    })(i);
}

Answer 2

要使用更现代的方法，请使用let ，适用于Firefox，chrome和node

如果您需要定位所有浏览器，请使用Anthony方法

for(var count = 0, l = list.length; count < l; count++) {
    let count;
    something.onclick = function() {
        openSomething("Value_" + count);
    }
}