鼠标悬停在Infobox上会将悬停事件悬停在其背后的标记上

时间:2013-06-11 13:05:01

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

我目前正在使用Google地图的InfoBox插件。不幸的是,我遇到了一个恼人的问题。

我的应用上的用户可以通过将鼠标悬停在相应的标记上来打开信息框。这很好。当InfoBox打开并且用户将鼠标悬停在InfoBox上时,会出现此问题。出于某种原因,InfoBox下方 的标记会触发鼠标悬停事件。这是一个很大的问题,因为它会在打开属于刚刚触发其鼠标悬停事件的标记的框之前关闭当前框。我做了一些搜索,我发现将每个标记设置为:

optimized: false

可以防止此错误。但是,此选项会降低地图的速度并使其使用起来变得很麻烦。

我的信息框:

infoWindows[obj.VehicleName] = new InfoBox({
    content: contentString,
    disableAutoPan: false,
    maxWidth: 500,
    pixelOffset: new google.maps.Size(-250, -490),
    boxStyle: {
         width: "500px"
    },
    enableEventPropagation: false,
    infoBoxClearance: new google.maps.Size(45, 1)
});

我的听众:

google.maps.event.addListener(marker, 'mouseover', function() {

1 个答案:

答案 0 :(得分:3)

丑陋的修复,因为没有任何广告选项(enableEventPropagation)似乎对我有效(我当然不希望在300多个标记上使用“optimized:false”)

在每个标记的鼠标悬停监听器内部,我会检查当前打开的InfoWindow是否正在悬停:

google.maps.event.addListener(marker, 'mouseover', function() {

    //If an InfoBox is currently open
    if(openInfoBox !== null){

        var id = $(openInfoBox.getContent()).attr('id');
        //If the main div inside that InfoBox is currently being hovered over
        if ($('#' + id + ':hover').length) {
            return false; //go no further. i.e. ignore mouseover event for marker
        }

    }

    //Open InfoBox etc etc