我有一个地图,目前捕获双击事件并触发一些代码来设置地图上的路点,它工作得很好。
我真正想做的是检测平板电脑/移动用户的长按,因为我认为双击方法(在我的ipad上工作得很好)不像用鼠标指针那么精确。我假设我将不得不以某种方式连接到onmousedown/onmouseup并设置定时器/阈值,但我正在努力得到这样的工作。
老问题-但由于我对此有点挣扎,我想我应该分享答案给那些通过谷歌查找的人。
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函数)。但是,如果用户抬起手指(从而触发触摸端事件),setTimeOut函数将被清除。如果用户移动手指(从而触发touchmove事件)或缩放级别改变(由multiTouchEvent变量监控),也会发生这种情况。
希望这能帮助到一些人。
Android 4+测试
试试下面的代码:
$(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;
});
});
演示