如何检测长按Google地图标记(javascript)?

时间:2014-07-16 06:56:58

标签: javascript google-maps javascript-events

我猜Google地图没有长按/ taphold事件处理程序。下面的代码是实现这个的方法吗?

4 个答案:

答案 0 :(得分:11)

我使用鼠标按下和鼠标按下事件监听器实现了长按功能。谢谢!!

var longpress = false;

    google.maps.event.addListener(marker,'click', function (event) {
            (longpress) ? console.log("Long Press") : console.log("Short Press");
        });



    google.maps.event.addListener(marker, 'mousedown', function(event){

                start = new Date().getTime();           
            });

    google.maps.event.addListener(marker, 'mouseup', function(event){

                end = new Date().getTime();
                    longpress = (end - start < 500) ? false : true;         

            });

答案 1 :(得分:7)

我知道这是一个老帖子,但我遇到了同样的问题,我发现我认为比@Anbarasan Thangapalam建议的更好的解决方案。

<强>解决方案:

var mousedUp = false;
google.maps.event.addListener(marker, 'mousedown', function(event){ 
    mousedUp = false;
    setTimeout(function(){
        if(mousedUp === false){
            //do something if the mouse was still down
            //after 500ms        
        }
    }, 500);
});
google.maps.event.addListener(marker, 'mouseup', function(event){ 
    mousedUp = true;
});

我认为使用较少的代码行和较少的侦听器函数可能会更好地理解这种方法。

要避免在拖动事件上触发超时功能,只需复制 mouseup 功能并使用 dragstart 进行更改。像这样:

google.maps.event.addListener(marker, 'dragstart', function(event){ 
    mousedUp = true;
});

答案 2 :(得分:1)

我由Rafaelmorais(使用拖动侦听器)实现了该解决方案,但是我认为触发标志“ mousedUp”的第一个声明应该是正确的。我更改了该触发变量(也将其重命名为更加直观),并且有效。

仅供参考...

放开长按事件后,也会触发单击事件(如果设置了单击侦听器)。为了防止发生两次事件,可以在点击侦听器中使用(!longPressed)禁止点击事件运行(如果需要)。

我清除了超时,以防止出现奇怪的情况,在该情况下,该函数将再次检查以查看longPressActive是否仍然为true,并且已将其取消设置/重置并仍然触发了事件。

使用任意鼠标键触发Mousedown事件(与触摸事件无关)。

Dragend不是必需的,因为dragstart会清除超时

var longPressTimeout = null;
var longPressActive = false;
var longPressed = false;

google.maps.event.addListener(marker, 'mousedown', function(event){
    longPressActive = true;
    longPressed = false;
    longPressTimeout = setTimeout(function(){
        if(longPressActive === true){
            console.log("Long Press")
            longPressed = true;
            //do something after marker long pressed for 1000ms
        }
    }, 1000);
});

google.maps.event.addListener(marker, 'mouseup', function(event){
    clearTimeout(longPressTimeout); 
    longPressActive = false;
});

google.maps.event.addListener(marker, 'dragstart', function(event){
    clearTimeout(longPressTimeout); 
    longPressActive = false;
});

(我将其发布为解决方案,因为我没有足够的代表对此发表评论)

答案 3 :(得分:0)

对我来说,下面的方法有效。要查看它是rightclick还是longPress,只需检查处理程序中的事件类型是否为“contextmenu”。

gMaps.event.addListener(overlay, 'click', function() {
    if(event.type === "contextmenu"){
     //longpress handler codes
    }
}