Google Maps Api V3 - 为同一标记对象分配多个侦听器

Mik*_*ell 5 javascript google-maps google-maps-api-3

目前正在开发一个项目,将我们的Goole Maps API从v2升级到v3并遇到问题,需要确认是否可以将多个侦听器注册到同一个标记.任何人都可以确认Goole Maps API v3是否支持API v2等同一标记上的多个侦听器?

示例代码:

var mapObject = document.getElementById('map_canvas');
var points = new Array();
var markers = new Array();

var mapOptions = {
    zoom: 16,
    center: new google.maps.LatLng(33.260081, -117.279369),
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    streetViewControl: false,
    draggable: true,
    scaleControl: false,
    zoomControl: true,                  
    panControl: true,                    
    scrollwheel: false,
    disableDoubleClickZoom: false,
    navigationControlOptions: {
    style: google.maps.NavigationControlStyle.ZOOM_PAN
}

map = new google.maps.Map(mapObject, mapOptions);

points.push(lat:'33.260081', lng:'-117.279369');
points.push(lat:'33.260079', lng:'-117.279371');
points.push(lat:'33.260083', lng:'-117.279373');

for (var i in points) {

    var point = points[i];

    var marker = initMarker(point);

    markers.push(marker);

    google.maps.event.addListener(marker, 'mouseover', function() {
        alert('mouseover');
    });

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

    google.maps.event.addListener(marker, 'mouseout', function() {
        alert('mouseout');
    });

    bounds.extend(new google.maps.LatLng(point.lat, point.lng));
}
Run Code Online (Sandbox Code Playgroud)

当我将鼠标悬停在标记上时,它会以"mouseout"警告,然后"鼠标悬停"两次.我希望它只能用'mouseover'警告一次.

当我点击一个标记时,它会通过'click',然后'mouseout',然后'click',然后'mouseover'来提醒.我希望它能提醒'点击'.

当我禁用'mouseover'和'mouseout'时,'click'按预期工作.当我禁用'click'和'mouseout'时,'mouseover'按预期工作.

这些事件似乎相互联系有什么理由吗?在API v2中,我们能够支持此功能没有问题.

提前致谢.

- 编辑 -

这似乎只发生在Firefox和IE中,Chrome按预期处理事件.

- 编辑 -

我已经开始设置2个地图演示,因此可以进行并排比较.

版本2网址:http://map.ownij.com/index2.php

版本3网址:http://map.ownij.com/

版本2甚至是Firefox,IE,Chrome中的监听器行为:

  • mouseover:mouseover
  • 单击:单击
  • mouseout:mouseout

Firefox,IE中的版本3事件监听器行为:

  • mouseover:mouseout,mouseover,mouseover
  • 单击:单击,鼠标移动,单击
  • mouseout:mouseout,mouseout

版本3甚至是Chrome中的监听器行为:

  • mouseover:mouseover
  • 单击:单击
  • mouseout:mouseout

如您所见,v3事件行为在chrome中按预期工作,但在FF和IE中,每个事件都会触发多个侦听器,从而导致异常行为.

我们构建地图以允许在用户将鼠标悬停在标记上时显示地图气泡,因此当鼠标悬停触发mouseout事件时,气泡会无限期地重新渲染,直到用户将鼠标移离标记.

在此问题得到解决之前,我们无法发布v3升级,否则我们会剥夺客户当前的功能.

- 编辑 -

更新了代码,通过将警报更改为console.log()调用,事件按预期触发.对于非infowindow调用(警报,ebubble等),似乎存在一些不寻常的事件处理.

Mik*_*ell 1

最终取消了悬停侦听器并使用点击侦听器。最终想重新添加悬停功能,但现在没有时间追踪它。