在循环中创建标记 - 在单击侦听器中时信息窗口不会打开答案

【问题标题】：creating markers in loop - Infowindow does not open when inside an click Listener在循环中创建标记 - 在单击侦听器中时信息窗口不会打开
【发布时间】：2011-11-30 12:09:33
【问题描述】：

我有一个带有多个标记的谷歌地图，每个标记都有自己的信息窗口。

当我点击时没有任何反应。仅供参考：我知道监听器会触发，因为我之前确实在其中设置了警报并且它起作用了。

问题代码是：

google.maps.event.addListener(point[i], 'click', function() {
     infowindow[i] = new google.maps.InfoWindow({content: contentString[i] });
     infowindow[i].open(map,point[i]);
});

如果我只是这样做

     infowindow[i] = new google.maps.InfoWindow({content: contentString[i] });
     infowindow[i].open(map,point[i]);

它有效。但不在我的 addListener 函数中。我猜这是 googlemaps 不喜欢的东西，但萤火虫给了我 0 个错误..

真的需要你的帮助。非常感谢！

【问题讨论】：

标签： javascript google-maps google-maps-api-3 google-maps-markers

【解决方案1】：

这是因为你可能在循环中有闭包！所以回调中的变量i在回调被调用的时候已经被覆盖了。您有两种选择来解决它：

1) 经典的“循环闭包”解决方法（每次循环迭代都执行另一个闭包）：

for (i = 0; i < 20; i++) { (function  (i) {
    google.maps.event.addListener(point[i], 'click', function() {
         infowindow[i] = new google.maps.InfoWindow({content: contentString[i] });
         infowindow[i].open(map,point[i]);
    });
})(i);
}

2) 避免关闭并使用标记数据结构：

for (i = 0; i < 20; i++) {
    point[i].i = i;
    google.maps.event.addListener(point[i], 'click', function() {
         this.myinfowindow = new google.maps.InfoWindow({content: contentString[this.i] });
         this.myinfowindow.open(map, this);
    });
}

（或者您也可以将 contentString 也移动到标记：point[i].contentString = ... 并在点击处理程序中使用 this.contentString。那么您不需要 point[i].i 属性。）

我个人更喜欢第二种解决方案而不是第一种，因为闭包会消耗内存等。

【讨论】：

这对我来说今晚在与 OP 相同的情况下工作。谢谢托马斯（Y）

【解决方案2】：

我有同样的问题，它与循环有关，因为当我使用这样的硬编码值时，它们确实有效：

                // Add infowindow
                google.maps.event.addListener(markers[0], 'click', function() {
                  infowindows[0].open(map,markers[0]);
                });
                // Add infowindow
                google.maps.event.addListener(markers[1], 'click', function() {
                  infowindows[1].open(map,markers[1]);
                });

【讨论】：