javascript - 防止点击事件传播/冒泡到 Google map 上

标签 javascript jquery google-maps dom-events

我正在使用 Google Maps API V3 的 MarkerClusterer 库将附近的标记分组为单个标记。当用户单击群集标记时,该群集标记旁边会出现一个 div。现在我想让它在点击集群标记后,关闭弹出的div,他可以点击 map 。

问题:在 map 上添加 google.maps.event.addListener(map, 'click', function(){}) 后,当用户点击在簇标记上打开弹出 div,没有任何反应!我猜测集群标记上的单击事件导致 div 弹出,但单击事件也传播到 map ,触发 map 的单击监听器关闭弹出窗口。

我希望我可以使用 jQuery 的 event.stopPropagation() 但我在哪里可以获得 event 对象?

如何解决这个问题?如何防止点击通过聚类标记传播到 map ?希望该解决方案是跨浏览器兼容的。

JS代码

clusterclickListener = google.maps.event.addListener(mc, "clusterclick", function (cluster) {
    $('#content_container').show();
});

google.maps.event.addListener(map, 'click', function() {
    $('#content_container').hide(); 
});

最佳答案

嗯。我刚刚测试了这个,一切都适合我。我唯一的建议是检查你的 div 是否有正确的 html/css/positioning,因为它可能只是被 map 掩盖了。

默认情况下,可以在处理函数中访问事件对象。如果您想访问事件对象,您可以简单地使用“event”访问它,因此 event.stopPropagation() 应该可以工作。请记住,如果您将“event”作为参数传递给处理函数,您将获得一个自定义的 Google map 点击事件,该事件没有 stopPropagation 方法。

关于javascript - 防止点击事件传播/冒泡到 Google map 上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10004550/

相关文章:

javascript - raphael.js - 将饼图转换为圆环图

javascript - 是否显示 :none keep elements from loading?

javascript - MapBox GL Javascript - 集群 - 计数不显示

android - 我的应用程序显示空白 map

javascript - 如何从 Google map url 获取准确的 lat lng

javascript - 每次调用 JavaScript 函数时移至数组中的下一项

javascript - 单击 <a> 文本以检查输入

javascript - Bootstrap 模式关闭时滚动停止工作

c# - 在客户端将服务器端 OnClientclick 更改为 jQuery

google-maps - 谷歌静态 map 配额已达到但远未接近 25,000 个限制