Events taphold jQuery Mobile 1.1.1之后触发的tap事件

我正在使用与jQuery Mobile 1.1.1捆绑的Phonegap为iOS开发一个应用程序。我的页面上有一个div，它正在监听tap和tapphold事件

我面临的问题是，一旦我抬起手指，tap事件将在taphold事件之后触发。我如何防止这种情况？ 提供了解决方案，但这是唯一的方法吗？如果您需要使用布尔标志来区分这两个事件，那么tap&taphold的两个不同事件就完全无效了

以下是我的代码：

$('#pageOne').live('pageshow', function(event) {
    $('#divOne').bind('taphold', function (event) {
       console.log("TAP HOLD!!");    
    });

    $('#divOne').bind('tap', function () {
      console.log("TAPPED!!");
    });
});

---

非常感谢您的帮助。谢谢

您可以使用jquery的stopImmediatePropagation（）方法来解决此问题。根据中的解释，stopImmediatePropagation（）方法

“阻止执行其余的处理程序，并防止 事件从DOM树冒泡而来。“

[经过考验] 我检查了jQuery Mobile的实现。他们每次在“vmouseup”上的“taphold”之后都会触发“tap”事件

如果触发了“taphold”，则解决方法是不触发“tap”事件。根据需要创建自定义事件或修改源，如下所示：

$.event.special.tap = {
    tapholdThreshold: 750,

    setup: function() {
        var thisObject = this,
            $this = $( thisObject );

        $this.bind( "vmousedown", function( event ) {

            if ( event.which && event.which !== 1 ) {
                return false;
            }

            var origTarget = event.target,
                origEvent = event.originalEvent,
                /****************Modified Here**************************/
                tapfired = false,
                timer;

            function clearTapTimer() {
                clearTimeout( timer );
            }

            function clearTapHandlers() {
                clearTapTimer();

                $this.unbind( "vclick", clickHandler )
                    .unbind( "vmouseup", clearTapTimer );
                $( document ).unbind( "vmousecancel", clearTapHandlers );
            }

            function clickHandler( event ) {
                clearTapHandlers();

                // ONLY trigger a 'tap' event if the start target is
                // the same as the stop target.
                /****************Modified Here**************************/
                //if ( origTarget === event.target) {
                 if ( origTarget === event.target && !tapfired) {
                     triggerCustomEvent( thisObject, "tap", event );
                 }
            }

            $this.bind( "vmouseup", clearTapTimer )
                .bind( "vclick", clickHandler );
            $( document ).bind( "vmousecancel", clearTapHandlers );

            timer = setTimeout( function() {
                tapfired = true;/****************Modified Here**************************/
                triggerCustomEvent( thisObject, "taphold", $.Event( "taphold", { target: origTarget } ) );
            }, $.event.special.tap.tapholdThreshold );
        });
    }
};

---

将其放入taphold事件处理程序中。。。此建议假定o是触发taphold的jQuery对象

jQuery（o）.one（'tap click'，function（）{return false；}）

---

与one方法的绑定将只触发一次事件。如果该事件是标记，则返回false将停止该事件的执行

只需将其设置在文档顶部或在定义您的文档之前的任何位置：

$.event.special.tap.emitTapOnTaphold = false;

然后你可以这样使用它：

$('#button').on('tap',function(){
    console.log('tap!');
}).on('taphold',function(){
    console.log('taphold!');
});

---

自从滑动触发taphold之后，我就能够通过以下方式保持简单：

    $(c).bind("taphold",function(e){
        if(e.target.wait){
            e.target.wait = false;
        }else{
            alert("fire the taphold");
        }//eo if not waiting
    });
    $(c).bind("swipe",function(e){
            e.target.wait = true;//taphold will come next if I don't wave it off
        alert(e.target.text+"("+e.target.attributes.dataId.value+") got swiped");
        return false;
    });

为了支持tap，我将延迟等待清除，直到tap事件也将始终触发。

$.event.special.tap={ 阈值：750

setup: function() {
    var thisObject = this,
        $this = $( thisObject );

    $this.bind( "vmousedown", function( event ) {

        if ( event.which && event.which !== 1 ) {
            return false;
        }

        var origTarget = event.target,
            origEvent = event.originalEvent,
            /****************Modified Here**************************/
            tapfired = false,
            timer;

        function clearTapTimer() {
            clearTimeout( timer );
        }

        function clearTapHandlers() {
            clearTapTimer();

            $this.unbind( "vclick", clickHandler )
                .unbind( "vmouseup", clearTapTimer );
            $( document ).unbind( "vmousecancel", clearTapHandlers );
        }

        function clickHandler( event ) {
            clearTapHandlers();

            // ONLY trigger a 'tap' event if the start target is
            // the same as the stop target.
            /****************Modified Here**************************/
            //if ( origTarget === event.target) {
             if ( origTarget === event.target && !tapfired) {
                 triggerCustomEvent( thisObject, "tap", event );
             }
        }

        $this.bind( "vmouseup", clearTapTimer )
            .bind( "vclick", clickHandler );
        $( document ).bind( "vmousecancel", clearTapHandlers );

        timer = setTimeout( function() {
            tapfired = true;/****************Modified Here**************************/
            triggerCustomEvent( thisObject, "taphold", $.Event( "taphold", { target: origTarget } ) );
        }, $.event.special.tap.tapholdThreshold );
    });
}

})

@阿卡什·布迪亚：谢谢你的解决方案。

---

太棒了，听起来对我很管用

我仍然有问题，使用jquery mobile的taphold，我解决了在taphold之后调用click的问题，在元素上设置了一个超时。 JQM 1.4，emitTapOnTaphold=false

例如：

$(".element").on("taphold", function () {
        // function her

         setTimeout (function () {
             $(this).blur();
         400);
});

---

感谢您的建议，但它没有解决问题。这不适用于“实时”处理程序。同一份文件提到了它@JeremieWeldin在上面指出了jquery.mobile.js文件本身的修改。我最终得到了。我本应该回来评论一下。谢谢