关于js批量绑定事件的问题
<body>
<ul id="list">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
<script>
var list_obj = document.getElementsByTagName('li');
for (var i = 0; i <= list_obj.length; i++) {
list_obj[i].onclick = function() {
alert(i);
}
}
</script>
</body>
for循环绑定完事件最后执行的时候都是最后一个事件相同，点击的时候弹出的不是0 1 2 3 4，而是5，这是为什么呢 如何解决
DIEA浏览 860回答 1
1回答
-
MYYA
当调用onclick事件的时候，会向上找到i对象的值。这个时候，由于已经循环完毕，所以i的值是5解决方法：闭包for (var i = 0; i <= list_obj.length; i++) { list_obj[i].onclick = (function(i){ return function() { alert(i); } })(i); }ES6for (let i = 0; i <= list_obj.length; i++) { list_obj[i].onclick = function() { alert(i); } }
随时随地看视频慕课网APP
相关分类
JavaScript