为什么我的谷歌地图事件监听器不能正常工作
why are my google maps event listeners not working properly?
我试图处理每个标记(有30个标记)的监听器上的鼠标,并显示这些标记的信息窗口。我为每个标记创建了侦听器,但是当我的鼠标在某个标记上时,它总是显示最后一个标记的信息窗口。总而言之,我听不懂其他标记。任何帮助都会很感激。提前感谢,这里是我的代码:
var listeners = [];
for(var i = 0; i < markers.length; i++){
var marker = markers[i];
var contentString = contents[i];
listeners[i] = new google.maps.event.addListener(marker, 'mouseover', function() {
var hideInfoWindows = function(){
for (var j = 0; j < util.Common.infowindows.length; j++) {
util.Common.infowindows[j].close();
}
}
var addInfoWindow = function(){
var infowindow = new google.maps.InfoWindow({
content: contentString
});
//hideInfoWindows();
util.Common.infowindows.push(infowindow);
infowindow.open(util.Common.googlemap,marker);
}
addInfoWindow();
});
}
我也在使用js集群库,但我不认为这个问题与它有关。
我认为你的问题可能是你没有在周期内使用闭包,当事件侦听器被触发时,marker
和contentString
变量指向最后一个标记。
试着像这样重写这个循环:
var listeners = [];
for(var i = 0; i < markers.length; i++){
(function(index){ //create a closure, variable 'index' will take its value from variable i, but won't be affected by changed i in the outer scope
var marker = markers[index]; //use this scope's index variable instead of i
var contentString = contents[index]; //use this scope's index variable instead of i
listeners[index] = new google.maps.event.addListener(marker, 'mouseover', function() {
var hideInfoWindows = function(){
for (var j = 0; j < util.Common.infowindows.length; j++) {
util.Common.infowindows[j].close();
}
};
var addInfoWindow = function(){
var infowindow = new google.maps.InfoWindow({
content: contentString
});
//hideInfoWindows();
util.Common.infowindows.push(infowindow);
infowindow.open(util.Common.googlemap,marker);
};
addInfoWindow();
});
})(i);
}
相关文章:
- Javascript:selenium Web驱动程序isDisplayed()不工作
- jQuery UI自动完成突然停止工作
- AngularJS UI路由器不能像ng路由器那样工作
- HTML5音频加载和播放获胜'我不能在iPad上工作
- JavaScript打印功能使日历停止工作
- Javascript.getHours()工作不正常
- 为什么这在IE中的工作方式与在Firefox中不同
- 视频HTML没有'无法在Internet Explorer 11上工作
- 扩展移相器按钮类不工作
- Firebase迁移-简单的Firebase.set没有'不再工作了——旧的还是新的
- 谷歌地图不是以HTML显示,而是在JS Fiddle上工作
- 正在尝试使用if和else添加类,但无法正常工作
- Jquery FadeIn FadeOut 只工作一次
- Foreach无法在Typescript中工作
- 另一个ajax调用中的Jquery ajax调用在for循环中没有按预期工作
- 为什么不是't窗口.恢复正常工作吗?(javascript/jquery)
- JS可以在Chrome中工作,但不能在Firefox中工作
- ajaxToolkit PopupControlExtender不工作.过时的
- HTML标记在脚本标记中工作
- javascript扫雷器floodfill算法不能正常工作