右键单击标记 - Google Maps V3答案

【问题标题】：Right Click on marker - Google Maps V3右键单击标记 - Google Maps V3
【发布时间】：2014-01-05 04:57:29
【问题描述】：

我一直在尝试在我的标记上单击鼠标右键，但到目前为止似乎没有触发该事件。作为一种解决方法，我目前正在检测地图上的右键单击，然后找到最近的标记并触发右键单击方法 - 显然这不是很好。

根据文档，标记确实有一个右键单击事件，所以我不确定我做错了什么。 https://developers.google.com/maps/documentation/javascript/reference#Marker

google.maps.event.addListener(marker, 'rightclick', handleRightClick)

没用，但是

google.maps.event.addListener(map, 'rightclick', handleRightClick)

工作正常。就像这样：

google.maps.event.addListener(marker, 'click', handleRightClick)

我还使用了一个名为 markerWithLabel 的自定义标记插件 - http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/1.1.9/docs/reference.html - 当我发现这并没有为右键单击添加事件侦听器但即使我自己添加了一个事件侦听器时，我以为我已经破解了它，仍然没有运气。我在第 257 行添加了这个：

google.maps.event.addDomListener(this.eventDiv_, "rightclick", function(e) {
    if (me.marker_.getClickable()) {
        google.maps.event.trigger(me.marker_, "rightclick", e);
        cAbortEvent(e);
    }
})

有没有人遇到过类似的问题或找到更好的解决方法？

提前致谢。

【问题讨论】：

你的handleRightClick函数是做什么的？
现在？它只是显示一个警报。只是想证明它的工作原理

标签： javascript jquery google-maps google-maps-api-3 right-click

【解决方案1】：

假设你有你的地图对象，它被称为 globalmap（你作为一个新的 google.maps.Map 制作）

这将在地图中心添加一个标记：

var newmarker=new google.maps.Marker({map:globalmap, position: globalmap.getCenter()});

这将监听右键单击标记；

google.maps.event.addListener(newmarker,  'rightclick',  function(mouseEvent) { alert('Right click triggered'); });

编辑：关于 MarkerWithLabel 插件，我可以看到它是从 google.maps.OverlayView 扩展而来的，并在 marker_ 的属性中传递了一个标记目的。这意味着您仍然可以按照自己的方式行事（从示例中复制）：

 var marker1 = new MarkerWithLabel({
   position: homeLatLng,
   draggable: true,
   raiseOnDrag: true,
   map: map,
   labelContent: "$425K",
   labelAnchor: new google.maps.Point(22, 0),
   labelClass: "labels", // the CSS class for the label
   labelStyle: {opacity: 0.75}
 });

然后添加右键行为为

google.maps.event.addListener(marker1.marker_,  'rightclick',  function(mouseEvent) { alert('Right click triggered'); });

【讨论】：

尝试按照您的建议剥离代码。右键单击在标准标记上触发。我正在使用的 markerWithLabel 插件一定不能正常工作。

【解决方案2】：

你的最后一次尝试：

google.maps.event.addDomListener(this.eventDiv_, "rightclick",function(){/**/});

...不会工作，因为没有rightclick-DOMMouseEvent。

您必须观察eventDiv_的click-事件，并检查该事件的button-属性是否设置为2（当它执行右键单击时已检测到）

【讨论】：

不幸的是，当我右键单击时，单击事件没有被触发。谷歌地图偷了他们..
使用 mouseup 而不是点击

【解决方案3】：

rightclick 事件适用于我的 google.maps.Marker：

  google.maps.event.addListener(marker, 'rightclick', function() {
    infowindow.setContent("<div style='width:100px'>rightclick</div>");
    infowindow.open(map,marker);
  });

working example

【讨论】：

是的，但不是当我右键单击标签本身时。