这个问题经常被问,但从来没有得到很好的回答。让我们看看能不能补救!
事件传播
Google允许您使用事件处理程序通过其API绑定到Google地图视图中的事件。
有时,你可能会将事件处理程序绑定到谷歌本身已经绑定的事件。因此,当你的事件触发并执行你让它做的任何事情时,你可能发现谷歌也在做自己的小事。
嗯,我可以处理这个事件,让我的代码运行,但阻止事件继续并启动谷歌的事件处理程序吗?
你当然可以!欢迎使用Event Propagation
(又名事件气泡)。
看看这个代码
在这里,我绑定了一个事件处理程序来双击谷歌地图:
var aListener = google.maps.event.addListener(map, 'dblclick', function(event) {
// Try to prevent event propagation to the map
event.stop();
event.cancelBubble = true;
if (event.stopPropagation) {
event.stopPropagation();
}
if (event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}
});
这里map
是要绑定到的Google Map对象。
这行不通。事件冒泡了,地图放大了。我不知道为什么。
你问,你读过文件吗?
的确如此。文件上说要使用event.stop();
我看过别人在说什么。这个问题正是我的问题。它被标记为已修复,但解决方案不起作用。
想法?
变通办法
双击事件的一个可能的解决方法是在需要谷歌不启动时禁用它的默认行为,然后稍后重新启用它。
您可以使用disableDoubleClickZoom
参数来执行此操作。请参阅此处的文档。
以下是一些要禁用的代码:
map.set("disableDoubleClickZoom", true);
现在重新启用:
map.set("disableDoubleClickZoom", false);
当然,当首先创建map
对象时,可以在MapOptions
参数中设置属性。
更新:不幸的是,我不得不发现Firefox无法通过window.event
访问当前事件,因此此代码无法在那里工作。我还没有找到解决办法。
事实证明,对代码的修复是最小的:只需从事件处理程序函数中删除event
参数,即可访问处理程序中的全局window.event
对象。
以下示例代码适用于IE和Chrome,但不适用于Firefox:
google.maps.event.addListener(map, "dblclick", function(googleMapsEvent) {
console.debug("caught double click");
// reference the global event object
// ignore the googleMapsEvent passed in by Google Maps!
event.preventDefault();
});
这个答案让我走上了正轨!
不是一个解决方案,而是一些想法,根据要求。。。
event.stopPropagation()
不是解决此类问题的通用灵丹妙药,原因有两个:
- 您的事件处理程序可能正在响应一个已冒泡的事件,即阻止在冒泡周期早期触发的事件处理(在本例中为缩放)为时已晚
- 这可能不是冒泡问题,而是同一级别正在处理的事件。
.addListener()
实现了一个观察者模式,这意味着在不删除以前由相同机制添加的任何处理程序的情况下,将新添加的内容添加到元素的"具体观察者"队列中
对于这两种情况,解决方法几乎毫无疑问是可用的,但可能需要谷歌地图的"内部知识"才能解决。
也许其他人比我知道得更多。