带有点击处理程序和滚动条的Google地图信息框

我有一个使用Google Maps javscript API和Infobox插件的应用程序(本机InfoWindow的可自定义版本)。

它工作正常,直到我有以下用例:如果内容很大,我需要一个带滚动条的信息框,并且它还需要包含一些带有点击监听器的HTML元素。

我通常需要做的是支持信息框内的点击处理程序,设置enableEventPropagation = true,并使用jQuery委托来设置点击处理程序。 如果我不允许事件传播,则jQuery委托不起作用。

这工作正常,直到我必须将它与具有正常运行的滚动条组合! 我发现滚动条仅在我有enableEventPropagation = false时才有效,因为如果启用了事件传播,则拖动事件只会传递给地图并被解释为平移。

有谁知道我能做些什么才能在信息框内容上有一个正常运行的滚动条,并且能够在某些内容上设置点击处理程序?

对我来说听起来合乎逻辑的是,enableEventPropagation = false会解决这两个问题,因为我不明白为什么需要将click事件传播到地图以触发我附加到html元素的处理程序。

这是我的信息框的设置对象:

{ content: "[my html in here]", disableAutoPan: false, pixelOffset: new google.maps.Size(-77, 10), boxClass: "infoBox", infoBoxClearance: new google.maps.Size(18, 30), closeBoxMargin: "14px 6px", pane: "floatPane", enableEventPropagation: true }; 

如果你还在使用这个,你需要更改你的地图选项,以便在鼠标进入信息框时关闭平移/缩放。 你可以使用这样的东西:

 $(document).delegate("div#ib", "mouseenter", function() { theMap.setOptions({ draggable: false, scrollwheel: false }); console.log("mouse enter detected"); }); $(document).delegate("div#ib", "mouseleave", function() { theMap.setOptions({ draggable: true, scrollwheel: true }); console.log("mouseleave detected"); });