Question

我在for循环中将索引传递给eventlistener时遇到了一些问题。

for (var i = 0; i < todos.length; i++) {
    console.log("XD");
    todos[i].addEventListener("mouseover", function() {
        trashShow[i].style.display = "inline";
    });
}

沟通显示说“无法读取未定义的属性'样式”。我认为索引是错误的，所以数组中没有这个元素。谢谢你的帮助。

Answer 1

我有一个问题，将索引传递给eventlistener in 循环。

如果使用i声明迭代器变量let，而不是var，则每次在事件侦听器中都会正确地增加i循环永远不会返回undefined错误。

工作示例：

var sections = document.getElementsByTagName('section');

var section1Divs = sections[0].getElementsByTagName('div');
var section2Divs = sections[1].getElementsByTagName('div');

for (let i = 0; i < section1Divs.length; i++) {

    section1Divs[i].addEventListener('mouseover', function() {
        section2Divs[i].style.backgroundColor = 'rgb(255, 0, 0)';
    });

    section1Divs[i].addEventListener('mouseout', function() {
        section2Divs[i].style.backgroundColor = 'rgb(191, 191, 191)';
    });
}

div {
display: inline-block;
width: 50px;
height: 50px;
margin-right: 12px;
background-color: rgb(191, 191, 191);
}

<section>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</section>

<section>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</section>

进一步阅读：

What's the difference between using "let" and "var" to declare a variable in JavaScript?

如何将索引传递给addeventlistener？ JS

1 个答案: