Question

我目前正在开发一个网站，其中包含带有自定义标记的Google地图。每个标记都有自己的链接，我可以轻松地将每个标记链接到URL，如下所示（此示例只有我的一个标记） -

 var image = 'parkour.png';
 var locations = [
    new google.maps.Marker({
      position: new google.maps.LatLng(43.670231, -79.386821),
      map: map,
      url: "http://bit.ly/RDYwKQ",
      icon: image
    })
  ]
  google.maps.event.addListener(locations[0], 'click', function() {
    window.location.href = locations[0].url;
  });

如您所见，我只是创建一个数组，添加一个元素，然后链接该元素。这很好用。但是，当我循环遍历每个元素以向每个元素添加一个监听器时，没有一个标记有一个链接（它们都仍然出现，仍然会导致鼠标改变，好像有一个链接，但点击什么都不做）。这是代码 -

  var image = 'parkour.png';
  var locations = [
    new google.maps.Marker({
      position: new google.maps.LatLng(43.670231, -79.386821),
      map: map,
      url: "http://bit.ly/RDYwKQ",
      icon: image
    })
  ]
  for(x in locations) {
    google.maps.event.addListener(x, 'click', function() {
        window.location.href = x.url;
    })
  }

请注意，唯一的变化是元素循环并以这种方式调用。

我已经尝试了所有的东西，从更改它到正常的for循环，到先创建一个标记，然后将它添加到数组中，我似乎无法找到任何修复。

有什么建议吗？

Answer 1

您不应使用for in语句循环遍历数组。 for in语句迭代对象的所有键并生成该键。要遍历数组，请使用简单的for循环。

另外，作为一种好的做法，您应该尽可能使用单个var语句并限制属性查找。另外，你必须小心闭包：JavaScript closure inside loops – simple practical example

var i = 0,
    len = locations.length,
    addListener = google.maps.event.addListener,
    l;

    for(; i < len; i++) {
        addListener((l = locations[i]), 'click', (function(l) {
            return function () {
                window.location.href = l.url;
            };

        })(l));
     }

放入数组时Javascript标记无法正常工作

1 个答案: