Javascript Onclick仅添加到循环中的最后一个元素

可能重复：

我需要代码中循环的帮助

我循环遍历一个数组，并将单击添加到div。但它总是在循环的最后一个循环中添加onclick，并有效地取消之前的循环

所以我把它作为我的循环：

    start = 0;

for(i = start; i < (start+8); i++){ //8 per page
    if(i == array.length){ 
        break;  //page end
    } else {
        (function(i){
             document.getElementById('cell'+i).onclick = function(){ select(i); }
        })(i);  
    }
}

start=0；
对于（i=start；i<（start+8）；i++）{//8每页
如果（i==array.length）{
break；//页面结束
}否则{
（职能（一）{
document.getElementById（'cell'+i）.onclick=function（）{select（i）；}
})（i） )；
}
}

这里出现的是div id

cell7

在单击添加时获得，但是div id

cell0

到

cell6

没有。我猜这与循环中的

I

变化以及函数中的

I

也受到影响有关

如何解决此问题？

您很接近：

(function(i){
    document.getElementById('cell' + i).onclick = function(){ select(i); }
})(i); 

我想你想要的是：

document.getElementById('cell'+i).onclick = (function(i){
    return function(){ select(i); }
})(i); 

此外，因为您有：

for(i = start; i < (start+8); i++)

如果它是全局代码，则不会有任何区别（但无论如何都要声明它）

编辑 上述方法并不能解决您的问题，它只是更改了语法

下面的“工作”对我来说，cell0到cell7有一个监听器，其余的没有<代码>选择显示正确的值（0到7，取决于单击哪个值）

函数addListener（）{
var start=0；
对于（i=开始；i<（开始+8）；i++）{
document.getElementById（'cell'+i）.onclick=（函数（i）{
返回函数（）{select（i）；}
})（i） )；
}
}
功能选择（arg）{
警报（arg）；
}
window.onload=addListener；
0
1
2
3
4
5
6
7
8
9

试试这个。var i=1，假设HtmleElement id从1开始。改变以反映情况

var select = function(i) {
    console.log(i);
};

var arr = ["1", "2", 3, 4, 5, 6];

var start = 0;
var max = 8;

for (var i=1; i<(start + max); i++) {
    if (i === arr.length) {
        break;
    } else {
        (function(i) {
            var element = document.getElementById(['cell', i].join(''));
            element.onclick = function() {
                 select(i);  
            };
        })(i);
    }
}

var选择=函数（i）{
控制台日志（i）；
};
var arr=[“1”、“2”、“3、4、5、6]；
var start=0；
var max=8；
对于（var i=1；i我不知道为什么，但这些建议并没有解决我的问题-但我设法找到了一种解决方法，在循环期间显示div时添加onclick，因此我最终执行了以下操作：

innerHTML = '<Div onclick="">'; //etc etc

innerHTML=''；//等

而不是将div添加到输出“then”稍后分配onclick…不知道我的新方法是否是最佳选择，但它有效，所以我必须坚持使用它！
我不使用jquery或任何库，因此指向jquery的解决方案并不是很有用。@Dave:这是您的实际代码吗？您正在关闭
i
变量，因此每次迭代都会创建一个单独的具有自己的
i
的作用域与外部循环的
i
分开。是的，这是我的代码-我没有遵循关于关闭i

的

的规定？@user1689607 hmm是的。@Dave立即调用的函数使用自己的
i
变量创建一个新的变量作用域。在该函数内创建的处理程序invocation关闭本地
i
变量，并保留对它的引用。基本上，您已经用内部
i
隐藏了外部
i
，因此您的处理程序将引用该变量并正常工作。仍然是同一个问题=/it只分配给最后一个div，其余部分不做任何事情。当我将其简化为：
document.getElementById（'cell'+i）.onclick=select（i）；
它做了它应该做的事情，除了函数直接运行（很明显），但是使用上面的方法u suggest只能在循环中的最后一个div上工作。有一些你没有显示的东西，可能与
if（i==array.length）
有关。我发布的示例“有效”。似乎对我有用。只是好奇：为什么要使用
['cell'，i]。加入（“”）
而不是
'cell'+i
？我最近越来越多地看到它。我做了很多node.js，在一些研究中，我偶然发现了这个谷歌。从那以后我一直在使用它，现在它已经成为我的惯例。你和其他人的演示对我有用。你是在使用IE6还是什么？顺便说一句，标记名应该总是小写的，即：
感谢您提供小写字母@minigodd的提示
var select = function(i) {
    console.log(i);
};

var arr = ["1", "2", 3, 4, 5, 6];

var start = 0;
var max = 8;

for (var i=1; i<(start + max); i++) {
    if (i === arr.length) {
        break;
    } else {
        (function(i) {
            var element = document.getElementById(['cell', i].join(''));
            element.onclick = function() {
                 select(i);  
            };
        })(i);
    }
}

innerHTML = '<Div onclick="">'; //etc etc