当 onclick 返回 false 时触发谷歌地图点击事件答案

【问题标题】：Google maps click event fired when onclick returns false当 onclick 返回 false 时触发谷歌地图点击事件
【发布时间】：2012-12-19 02:24:08
【问题描述】：

我正在为 api v3 使用 Redfin 的快速标记覆盖。

以他们的可点击示例为例，

https://code.google.com/p/multimarker/source/browse/trunk/fast-marker-overlay/maps-v3/example/clickable.html?r=22

我像这样在 initialize() 函数中添加了一个点击监听器，

function initialize() {
  var latlng = new google.maps.LatLng(37.4419, -122.1419);
  var myOptions = {
    zoom: 4,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  var map = window.map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

  google.maps.event.addListener(map, 'click', function() {
      alert('map click'); 
  });
}

并通过在 addInfoWindow 调用后添加 return false 来修改标记模板，

var marker = new com.redfin.FastMarker(/*id*/i, latlng, ["<div class='marker' onclick='addInfoWindow(", i,"); return false;'>&nbsp;</div>"], null);

如果我在 chrome 中运行它，它会按预期工作。 addInfoWindow 被调用，信息窗口弹出，返回 false 被击中，没有其他事情发生。然而，在 Firefox 和 IE 中，返回 false 似乎被忽略了，并且触发了地图点击事件以提醒“地图点击”。

在我的真实世界应用程序中，地图点击事件会触发信息窗口关闭事件。因此，在 chrome 中显示信息窗口，单击地图并关闭。在 Firefox/IE 中单击标记，信息窗口被构建，但地图单击被触发并立即关闭。

任何人都可以看到问题吗？ chrome 是否跳过了一个 bug，firefox 和 IE 不喜欢。

【问题讨论】：

返回 false 是为了防止页面重新加载。您真的需要代码中的地图点击处理程序吗？删除它会使您的应用程序正常工作吗？
onclick 一个 div 不会导致重新加载。在锚上它会。是的，我需要点击处理程序，就好像用户点击地图信息窗口应该关闭一样。这是 v2 中的默认行为。
我认为这与向下传播到地图的事件有关。

标签： javascript google-maps-api-3 google-maps-markers

【解决方案1】：

将此添加到 onclick 属性的开头：

try{event.stopPropagation();}catch(e){event.cancelBubble=true;}

【讨论】：

很好，谢谢。我认为这是事件传播，我只是无法让它停止正确传播。