这是 HTML 和 JS 代码:
let sides = document.getElementsByClassName("sides");
for (var i=0;i<sides.length;i++){
console.log(sides[i].innerHTML); // top left
sides[i].addEventListener("click", function(){
console.log(sides[i]); //Undefined
})
}
<div class="sides">top</div>
<div class="sides">left</div>
当我
console.log(sides[i])
我得到了 div 元素,但是当我添加 addEventListener
时它显示undefined
.请有人帮忙。
最佳答案
更改sides[i]
至this
以便它可以引用单击的元素本身。您的解决方案不起作用的原因是您的变量 i
由于 i++
,在最后一次迭代后递增到 2 .所以当事件监听器被触发时,sides[i]
现在是 sides[2]
.另一种方法是实例化 i
使用 let
如let i = 0
,则可以访问sides[i]
<div class="sides">top</div>
<div class="sides">left</div>
<script>
let sides = document.getElementsByClassName("sides");
for (let i=0;i<sides.length;i++){
console.log(sides[i].innerHTML); // top left
sides[i].addEventListener("click", function(){
console.log(this);
console.log(sides[i])
})
}
</script>
关于javascript - 循环内的 addEventListener 未定义 div 元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66811836/