Javascript 只有循环的最后一次迭代成功注册了我的单击事件？

今天我读了几篇关于将循环生成的变量传递给函数的文章，甚至成功地复制了我所看到的一些问题，并正确地实现了这些问题的修复。然而，有一个问题我似乎找不到答案。我编写了一个循环，它将项目添加到下拉列表中，并通过

id

为这些项目的

click

事件创建事件监听器。我已经验证了

id

是唯一的，并且没有任何冲突。但是，当我检查

项

数组时，只有最后一项与

onclick

关联，因此我认为我遇到了另一个范围问题

类测试{
项目=[]；
建造商（集装箱）{
this.ContainerID=ContainerID；
this.Container=document.getElementById（containerID）；
}
附加项（项目）{
for（设i=0；i”+项目[i]+''；
让item=document.getElementById（itemID）；
item.addEventListener（“单击”，this.OnClick.bind（this，item））；
此.Items.push（item）；
}
}
OnClick（项目）{
警报（item.innerText）；
}
}
var testObject=新测试（“测试容器”）；
添加项（[“选项1”、“选项2”、“选项3”、“选项4”）
html，正文{
身高：100%；
保证金：0；
显示器：flex；
对齐项目：居中；
证明内容：中心；
}
保险商实验室{
填充：0；
保证金：0；
列表样式类型：无；
最大高度：200px；
溢出y：自动；
}
ul>li{
填充物：5px；
保证金：5px；
光标：指针；
背景色：#333；
颜色：#fff；
}
您确定只得到一个侦听器，或者您有多个侦听器，它们都作用于同一项，而不是每个项？您的示例太复杂，无法在代码段中工作，因此您可能难以获得答案。但是，我怀疑这是您的
这个
引用，当执行单击处理程序时，它不会被设置为您期望的值

您有两个附加项函数。第一个参数似乎误用了
this
参数，但最后一个参数似乎成功地将其捕获为
ddl
。您可以直接在浏览器devtools中检查每个项目，以查看每个项目是否具有唯一的侦听器。如果是这样，您应该重述您的问题（如果您没有幸运地得到答案，请尝试获取一个较小的示例）。
当您连接
容器的
innerHTML
属性时，您正在替换DOM元素的全部内容，从而丢失所有已绑定的事件。您可以在处理完
容器的
innerHTML
后绑定事件（这可能是一种解决方法，但仍然很糟糕），也可以使用正确的方法：
appendChild
：


类测试{
项目=[]；
建造商（集装箱）{
this.ContainerID=ContainerID；
this.Container=document.getElementById（containerID）；
}
附加项（项目）{
让itemID，item；
for（设i=0；i
html，
身体{
身高：100%；
保证金：0；
显示器：flex；
对齐项目：居中；
证明内容：中心；
}
保险商实验室{
填充：0；
保证金：0；
列表样式类型：无；
最大高度：200px；
溢出y：自动；
}
ul>li{
填充物：5px；
保证金：5px；
光标：指针；
背景色：#333；
颜色：#fff；
}
我已经更新了我的代码片段，删除了所有我能删除的内容，以便正确复制问题。事实上，这只是最后一个元素上的一个事件。我相信这是由于循环的每次迭代都会覆盖项。您有一个项数组，您有一个this.items数组。您总是生成一个ID为this.Items.length的数组，但我无法判断该数组是否正在更改。您的意思是让itemID=“li dd-”+this.ContainerID+“-”+i
代替吗？不是，因为您可以通过n次调用来添加项目，所以最近的调用应该将该id添加为下一个可用的id；这将以0-n方式创建id。如果有帮助，请再调用一次，以使用另一个数组添加项（即使一个项也可以）。我要看看这会对事件注册产生什么影响，并在我进行更新时更新我的帖子。我更新了片段，但结果发现在移动设备上运行整个过程时出现了错误。我到家后再看一遍。欢迎。如果要从页面中删除所有事件
document.body.innerHTML+=''就可以了。