从外部链接打开 Google 地图信息窗口

Question

我目前正在使用 Javascript API v3 创建一些 Google 地图应用程序。它是来自 wordpress 数据库的结果地图，它动态地填充地图，在地图上创建标记，并在侧边栏上创建 wordpress 文章列表。

我正在尝试做的是以下内容：

当点击侧边栏wordpress文章的链接时，不是立即进入文章，而是必须在地图上打开相应的信息窗口。我尝试用 JQuery 来做，在链接上绑定一个点击事件以打开信息窗口，但不幸的是，它一直打开最后创建的信息窗口。

我确实理解这里的问题：JQuery 仅在触发事件时评估“标记”变量，因此使用变量的最后一个已知值。

我想要做的实际上是在循环中评估“标记”变量。我被困住了。如果有人能帮我解决这个问题，我将不胜感激。

感谢您花时间回答我。

这是应用程序的链接：http://88.191.128.36/buddypress/carte/

这里是函数本身：

    function setMarkers(map, markers) {
    for (var i = 0; i < markers.length; i++) {
        var sites = markers[i];
        var siteLatLng = new google.maps.LatLng(sites[1], sites[2]);

        if( sites[4] == '10'){
            var MarkerImage = new google.maps.MarkerImage('http://dediope.inovawork.net/buddypress/wp-content/themes/TheSource/images/marker-hotel.png');
      } else if (sites[4] == '9') {
            var MarkerImage = new google.maps.MarkerImage('http://dediope.inovawork.net/buddypress/wp-content/themes/TheSource/images/marker-golf.png');
        }

        var marker = new google.maps.Marker({
            position: siteLatLng,
            map: map,
            icon: MarkerImage,
            title: sites[0],
            html: '<div><b>' + sites[0] + '</b> <br /> <a href="' + sites[3] + '"> Voir la fiche de ce lieu </a></div>'
        });


    marker_array[i] = marker ;

    // THIS IS WHERE I NEED HELP :)
    $j('#results_entry li .title:contains("' + sites[0] + '")').bind('click', function(){  infowindow.setContent(  marker.html ); infowindow.open( map, marker ); }) ; 

       var contentString = '<div><b>' + sites[0] + '</b> <br /> <a href="' + sites[3] + '"> Voir la fiche de ce lieu </a></div>';

       var infowindow = new google.maps.InfoWindow({
            content: contentString
        });

       google.maps.event.addListener(marker, "click", function () {
           infowindow.setContent(this.html);
           infowindow.open(map, this);
        });       
    }
}

PS : 对不起，如果我没有很好地解释，我是法国人，所以我的英语不是很完美:)

Answer 1

感谢这篇文章，我终于找到了解决方案：

Google Maps v3 opens the last infoWindow when a marker is clicked

实现它的方法是将对象'marker'和'infowindow'实际传递给外部函数，然后绑定事件。这样，它将正确的标记和信息窗口绑定到链接。

这里有一段代码向您展示我是如何做到的，以防其他人遇到与我相同的问题：

// I REPLACED THAT
$j('#results_entry li .title:contains("' + sites[0] + '")').bind('click', function(){  infowindow.setContent(  marker.html ); infowindow.open( map, marker ); }) ; 


// BY THAT
BindLink(marker, sites[0], infowindow);

我在函数 setmarkers() 之外创建了一个 BindLink 函数：

function BindLink( bmarker, titre, binfowindow ){
    $j('#results_entry li .title:contains("' + titre + '")').bind('click', function(){  
        binfowindow.setContent(  bmarker.html ); 
        binfowindow.open( map, bmarker ); 
    }) ;    
}

现在它工作得非常好（除了我无法关闭之前打开的信息窗口，但这是另一回事！）