0

问题:

mouseout当用户将鼠标拖过标记过快时,事件触发得太早并导致信息框保持打开状态。换句话说......如果用户快速移入和移出标记......mouseover事件触发,然后mouseout事件触发......但是,placesService回调被执行并被ib.open()调用。

编码:

map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

var request = {
    key: 'for_my_eyes_only',
    location: new google.maps.LatLng(some_lat, some_lng);,
    radius: '500',
    types: ["restaurant"]
};

var service = new google.maps.places.PlacesService(map);
service.search(request, placesCallback);

function placesCallback(results, status) {
    if (status == google.maps.places.PlacesServiceStatus.OK) {
        for (var i = 0; i < results.length; i++) {

            var place = results[i];
            var marker = new google.maps.Marker({
                map: map,
                position: place.geometry.location,
            });

            //Infobox settings
                var ib = new InfoBox({
                    //a bunch of irrelevant properties.
                });

            google.maps.event.addListener(marker, 'mouseover', markerMouseOverFactory(place, marker, ib));
            google.maps.event.addListener(marker, 'mouseout', markerMouseOutFactory(ib));
        }
    }
}

function markerMouseOverFactory(place, marker, ib){
    return function(){
        var detailService = new google.maps.places.PlacesService(map);
        detailService.getDetails({reference: place.reference}, function(details, status){
            if (status == google.maps.places.PlacesServiceStatus.OK) {
                ib.setContent(/*set some content using details*/);
                ib.open(map, marker);
            }
        });
    }

}

function markerMouseOutFactory(ib){
    return function(){
        ib.close();
    }
}

问题:

有没有办法放弃谷歌地图 AJAX 请求?如果我可以在侦听器中放弃 AJAX 请求mouseout,一切都会好起来的。或者,你将如何解决这个问题?我尝试在 mouseout 中使用一个简单的标志,但无法使其正常工作。

4

1 回答 1

1

据我所知,没有方法可以取消 API 中的请求。但我要做的是延迟mouseover事件内部执行的回调。这样如果用户握住鼠标的时间超过了指定的时间;这意味着他/她想要infobox显示。

解决方法:

var delayTimer, delay = 800; //less than 1 sec. delay
google.maps.event.addListener(marker, 'mouseover', function() {
    delayTimer = setTimeout(function() { 
        markerMouseOverFactory(place, marker, ib); 
    }, delay);
});

google.maps.event.addListener(marker, 'mouseout', markerMouseOutFactory(ib));
function markerMouseOutFactory(ib){
    clearTimeout(delayTimer); //clear timeout here
    return function(){
        ib.close();
    }
}
于 2013-02-18T03:03:10.927 回答