在openlayers地圖上檢測長按

Question

我有一張地圖，目前可以捕捉到雙擊事件並激發一些代碼來在地圖上設置一個航點並且效果很好。

我真的很想做的是檢測平板電腦/手機用戶的長按，因爲我認爲雙擊方法（在我的ipad上工作正常）不像使用鼠標指針那麼精確。我認爲我必須以某種方式配合onmousedown/onmouseup並設置一個計時器/閾值，但我正在努力獲得這樣的工作。

Answer 1

試試這個代碼：

$(document).ready(function() { 
    var longpress = false; 

    $("button").on('click', function() { 
     (longpress) ? alert("Long Press") : alert("Short Press"); 
    }); 

    var startTime, endTime; 
    $("button").on('mousedown', function() { 
     startTime = new Date().getTime(); 
    }); 

    $("button").on('mouseup', function() { 
     endTime = new Date().getTime(); 
     longpress = (endTime - startTime < 500) ? false : true; 
    }); 
}); 

DEMO

Answer 2

老問題 - 但因爲我有這個有點掙扎我想我會分享的人通過谷歌尋找答案。

var multiTouchEvent = 0; 
var timeoutId; 
var waitFor = 1000; 
$(document).delegate("#openLayersMapDiv", "pagecreate", function() { 
    map.events.register('touchstart', map, function(e) { 
     multiTouchEvent = e.touches.length; 
     timeoutId = setTimeout(function() { 
       if (multiTouchEvent > 1) { 
        clearTimeout(timeoutId); 
       } 
       else { 
        alert("longpress!!!"); 
       } 
     }, waitFor); 
    }, true); 

    map.events.register('touchmove', map, function(e) { 
     clearTimeout(timeoutId); 
    }); 
    map.events.register('touchend', map, function(e) { 
     clearTimeout(timeoutId); 
    }); 
} 

上述警報將在1000毫秒後觸發。將waitFor值更改爲您希望用戶按下地圖的時間。

說明：基本上，touchstart事件在等待1000毫秒後（通過setTimeOut函數）觸發事件。但是，如果用戶擡起手指（從而觸發touchend事件），setTimeOut函數將被清除。如果用戶移動他們的手指（從而觸發touchmove事件）或縮放級別改變（由multiTouchEvent變量監視），也會發生這種情況。

希望這可以幫助別人。

在Android上測試4+