2

我正在尝试为短按实现一个事件，而为长按实现不同的事件。短按只是做默认动作。长按有效，但仍然执行默认操作。我错过了什么？

  HTML
   <a href="http://myLocation" class="recordlongpress"><"Label for my Link"</a>

  Javascript
    $(document).ready(function(){
        $('.recordlongpress').each(function() {

        var timeout, longtouch;

        $(this).mousedown(function() {
            timeout = setTimeout(function() {
                longtouch = true;
            }, 1000);
        }).mouseup(function(e) {
            if (longtouch) {
                e.preventDefault();
                $('#popupPanel').popup("open");
                return false;
            } else {
                return;      
            }
            longtouch = false;
            clearTimeout(timeout);
        });

    });
});

我遵循了 jQuery 文档，并在印象中“preventDefault”应该停止短按默认操作。我在网上找到的任何例子似乎都不完全是我的情况。感谢您花时间阅读本文。感谢您的任何意见。

4

3 回答 3

0

在清除超时并将“longtouch”设置为false之前，您正在从“mouseup”处理程序返回。

尝试：

    }).mouseup(function(e) {
        var returnval;

        if (longtouch) {
            e.preventDefault();
            $('#popupPanel').popup("open");
            returnval = false;
        } 

        longtouch = false;
        clearTimeout(timeout);

        return returnVal;
    });

我还会在“mousedown”处理程序中清除“longtouch”。也就是说，我不会对鼠标事件执行此操作。我会使用“touchstart”和“touchend”。在触摸屏设备上，“鼠标”事件是从触摸事件中模拟出来的，并且存在明显的延迟。（您可能还想检测手指在触摸期间是否移动。）

于 2013-04-08T13:18:46.567 回答
0

jsFiddle 演示

在您的代码中，这些行无法访问

     longtouch = false;
     clearTimeout(timeout);

JS：

 $('.recordlongpress').each(function () {

    var timeout, longtouch = false;

    $(this).mousedown(function () {

        timeout = setTimeout(function () {
            longtouch = true;
        }, 1000);
        e.preventDefault();
    }).mouseup(function (e) {
        clearTimeout(timeout);
        if (longtouch == true) {
            longtouch = false;
            $('body').append("long press" + longtouch);

            return false;
        } else {
            return;
        }

    });

});
于 2013-04-08T13:27:32.983 回答
0

@Pointy 引导我找到点击事件的有效解决方案。

    $(document).ready(function(){
    $('.recordlongpress').bind('tap', function(event) {
        return;
    });
    $('.recordlongpress').bind('taphold', function(event) {
        $('#popupPanel').popup("open");
    });
});

仍然需要添加一些内容，因为在我的移动设备上长按后，默认选项屏幕会显示四个选项；打开，保存链接，复制链接 URL 和选择文本仍然会弹出。一旦找到它，我将为此添加修复程序。

于 2013-04-08T14:07:37.650 回答