google maps + jquery auto close last infowindow

时间:2012-11-04 14:36:28

标签: jquery google-maps mouseover

当用户将鼠标悬停在地址上时,我试图在标记上调用mouseover事件。当打开新的infowindow需要关闭最后的infowindow,但不知道如何开始。打开此页面:

http://fiddle.jshell.net/spYYh/12/

Plz帮助我!谢谢!

1 个答案:

答案 0 :(得分:0)

这个问题类似于这个问题 - Google Maps API v3: Close infowindow when DOM element is clicked - 所以答案适用。

关键区别在于您要检测鼠标悬停事件,这将是"mouseover"事件,而不是参考问答中提到的"click"事件。

google.maps.event.addListener(marker, 'mouseover', function() {
   infowindow.setContent(contentString);
   infowindow.open(map, marker);
});

您的问题是服务多个标记并不重要。我们可以这样做: -

var infowindow = null;
.
.
.
/* now inside your initialise function */
infowindow = new google.maps.InfoWindow({
    content: "holding..."
});

for (var i = 0; i < markers.length; i++) {
    var marker = markers[i];
    google.maps.event.addListener(marker, 'mouseover', function() {
        //open the infowindow when it's not open yet
        if(contentStringCal!=infowindow.getContent())
        {
          infowindow.setContent(contentStringCal);
          infowindow.open(map, marker);
        }
    });

    google.maps.event.addListener(marker, 'click', function() {
        //when the infowindow is open, close it an clear the contents
        if(contentStringCal==infowindow.getContent())
        {
          infowindow.close(map, marker);
          infowindow.setContent('');
        }
        //otherwise trigger mouseover to open the infowindow
        else
        {
          google.maps.event.trigger(marker, 'mouseover');
        }
    });

    //clear the contents of the infwindow on closeclick
    google.maps.event.addListener(infowindow, 'closeclick', function() {
          infowindow.setContent('');
    });
}