javascript - 添加点击到谷歌地图 api v3

Question

我有一个包含 7 个标记点的数组，我想为每个标记添加一个点击处理程序。我正在尝试这样做

for (var i = 0; i <= 7; i++) {
     google.maps.event.addListener(googleMarkerPoints[i], 'click', function () {
     var selector = "div[data-num='" + i + "']";
     $(selector).css({ "background-color": "#999" });
  });
}

googleMarkerPoints是这样填充的：

for (var i = 0; i < data.length; i++) {
      var obj = data[i];
      var latitude = obj.Latitude;
      var longitude = obj.Longitude;
      var title = obj.Title;
      var thisLatlng = new google.maps.LatLng(latitude, longitude);
      var thismarker = new google.maps.Marker({
            position: thisLatlng,
            map: map,
            title: title
          });
      googleMarkerPoints.push(thismarker);
}

我的问题是每次我单击处理程序中的任何标记时selector都会被填充
"div[data-num='7']"

我希望每个标记从 1 到 7 的 data-num 会有所不同，为什么这些点击处理程序不能正常工作？

Answer 1

您即将结束i，因此您只能获得所有事件的一个值。尝试将i值传递给您的匿名函数，如下所示：

for (var i = 0; i <= 7; i++) {
 (function(i){
  google.maps.event.addListener(googleMarkerPoints[i], 'click', function () {
   var selector = "div[data-num='" + i + "']";
   $(selector).css({ "background-color": "#999" });
  });
 })(i)
}