谷歌地图：将参数绑定到点击事件答案

【问题标题】：Google maps: Bind params to click event谷歌地图：将参数绑定到点击事件
【发布时间】：2017-04-10 18:42:48
【问题描述】：

我正在使用 Google Maps JavaScript API 在地图上添加标记。对于每个标记，我为每个标记的 click 事件添加了一个侦听器。下面是我的代码。

for (var i = 0; i < markers.length; i++) {
    var marker = addMarker(markers[0]); //The addMarker function contains the code to add the marker

    marker.addListener('click', function() {
        console.log(i);
    });
}

我还想将i 参数绑定到click 事件，这样当它触发时，我可以使用i 中的值做一些事情（稍后我会将其更改为不同的变量）。但是，无论我在控制台上单击哪个标记总是会注销 i 的最后一个值。

因此，对于循环的每次迭代，它都会覆盖点击事件的回调。有谁知道我该如何解决这个问题？

【问题讨论】：

你应该将你的事件分配包装在一个闭包中
@Roljhon 我不完全理解闭包，你能解释一下吗？

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

【解决方案1】：

如果你想使用闭包，你可以这样做。这将在您单击时保留i。

请注意，以下仅是指出该想法的示例。

var markers = ["marker1","marker2","marker3"];
for (var i = 0; i < markers.length; i++) {

      var marker = addMarker(markers[i]); //The addMarker function contains the code to add the marker
      (function(_i,marker){
        marker.addEventListener('click', function() {
            alert(_i);
       });
      })(i,marker)
}

function addMarker(marker){
    var elem = document.createElement('div');
    elem.id = marker;
    elem.textContent = marker;
    document.body.appendChild(elem);
    return elem;
}

【讨论】：