我有一张地图,目前捕捉到双击事件并触发一些代码来在地图上设置一个航点,它工作得很好。
我真正想做的是检测平板电脑/移动用户的长按,因为我认为双击方法(在我的 ipad 上运行良好)不如使用鼠标指针精确。我认为我必须以某种方式与 onmousedown/onmouseup 相关联并设置一个计时器/阈值,但我正在努力让这样的事情发挥作用。
我有一张地图,目前捕捉到双击事件并触发一些代码来在地图上设置一个航点,它工作得很好。
我真正想做的是检测平板电脑/移动用户的长按,因为我认为双击方法(在我的 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 函数)。但是,如果用户抬起手指(从而触发 touchend 事件),setTimeOut 函数将被清除。如果用户移动手指(从而触发 touchmove 事件)或缩放级别更改(由 multiTouchEvent 变量监控),也会发生这种情况。
希望这可以帮助某人。
在安卓 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;
});
});