3

我有一张地图,目前捕捉到双击事件并触发一些代码来在地图上设置一个航点,它工作得很好。

我真正想做的是检测平板电脑/移动用户的长按,因为我认为双击方法(在我的 ipad 上运行良好)不如使用鼠标指针精确。我认为我必须以某种方式与 onmousedown/onmouseup 相关联并设置一个计时器/阈值,但我正在努力让这样的事情发挥作用。

4

2 回答 2

7

老问题 - 但由于我对此有点挣扎,我想我会为通过谷歌浏览的人分享答案。

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+ 上测试

于 2013-10-22T21:00:58.450 回答
0

试试这个代码:

$(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;
    });
});

演示

于 2013-03-25T20:17:23.360 回答