function“闭包”解决for循环和监听器冲突的问题：

在弄百度地图的时候，需要给地图上的每一个标注（Marker）添加监听事件，

 

开始的想法当然是用for循环，但发现一个问题，无论点击那个标注，显示的内容都是一样的，

 

实在想不通就百度了一下，果然找到了解决办法，

 

以下为转载内容：

 

 

事件闭包

闭包是Javascript脚本语言的特性之一，不熟悉它的开发者很可能犯下面这种错误：页面有十个标注（Marker实例），我希望点击不同的标注开启内容不同的信息窗口，每个信息窗口显示该标注的索引（1到10）。首先我们初始化标注实例并存放于数组中：

 

var markers = [];
for (var i =0; i <10; i ++) {
	var mkr =new BMap.Marker(new BMap.Point(116.2+ i /20, 39.855), {title: i +1});
	markers.push(mkr);
	map.addOverlay(mkr);
}

 下面，我们添加标注的点击事件，用来开启内容不同的信息窗口：

 

for (i =0; i <10; i ++) {
	markers[i].addEventListener('click', function(){
		this.openInfoWindow(new BMap.InfoWindow('我是第'+ (i +1) +'个标注'));
	});
}

 代码看起来没有任何问题，循环遍历markers数组，为每个标注实例绑定click事件，事件处理函数中开启信息窗口并显示是第几个标注。但是通过浏览器看效果的时候却发现问题了。（图片不显示）明明是第三个标注，点击之后的信息窗口中却显示“11”。实际上，当click的监听函数被执行的时候才会去看变量i的值是什么，此时for循环早已经执行完，那么当for循环执行完i的值正好是11。为了达到我们想要的效果，需要增加一层“闭包”：

 

for (i =0; i <10; i ++) {
	(function(){
		var index = i;
		markers[i].addEventListener('click', function(){
			this.openInfoWindow(new BMap.InfoWindow('我是第'+ (index +1) +'个标注'));
		}); 
	})();
}

 上面的代码你可以理解为新增加的函数内部保存了每次循环变量i的值，那么当监听函数执行时将会获取闭包内保存的index变量的值，而不是之前的变量i的值。

 

转载地址

 

贴上一个关于javascript闭包的连接：javascript深入理解js闭包