首页 > 代码库 > 使用for循环添加点击事件时，获取i值的方法

使用for循环添加点击事件时，获取i值的方法

2024-09-05 19:10:27   218人阅读

比如页面上有一个ul，数个li，现在给li添加点击事件。

    var li = document.getElementsByTagName("li");
　　　　for(var i = 0; i < li.length; i++) {
	li[i].addEventListener("click",function () {
	console.log(i);
	})
　　}

但是，这样写之后我们发现，点击任何一个li，打印的值都为5，这是因为闭包中共用i值，而i的值由于执行for循环，都变为了5

为了正常显示i值，我们可以使用如下方法:

 

 for (var i = 0; i < lis.length; i++) {
    (function(arg){
        li[arg].onclick = function(){
            console.log(arg);
        };
    })(i)   
 }

　　

类似于这样

			var li = document.getElementsByTagName("li");
			for(var i = 0; i < li.length; i++) {
				getConsole(i);
			}
			
			
			function getConsole(i){
				li[i].addEventListener("click", function() {
					console.log(i);
				});
				
			}

　　

使用for循环添加点击事件时，获取i值的方法


联系
我们