tapholdの後にタップイベントが発生しましたjQuery Mobile 1.1.1

Question

jQuery Mobile 1.1.1にバンドルされたPhonegapを使用してiOS用のアプリケーションを開発しています。私はタップとタポールの両方のイベントを聞いている私のページにdivを持っています。

私が直面している問題は、いったん指を持ち上げるとタポールイベントの後にタップイベントが発生するということです。これをどうやって防ぐのですか？ 解決策はhereですが、これを行うにはこれが唯一の方法ですか？あなたは2つを区別するためにブーリアンフラグを使用する必要がある場合、タップ&タポルドの2つの異なるイベントを持つポイントを無効にします。続き

は私のコードです：

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

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

は助けを大幅にお願い申し上げます。ありがとう！

Answer 1

私はjQueryのモバイルの実装を確認 [実証済み]。彼らは毎回 'タンプード'の後に 'vmouseup'で 'タップ'イベントを発砲しています。

「タポルド」が発砲された場合、「タップ」イベントを発生させないようにするには、回避策はです。。カスタムイベントを作成するか、次のようにあなたが必要とするごとにソースを変更します。

あなたtapholdイベントハンドラでこれを入れ

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

Answer 2

この問題を解決するには、jqueryのstopImmediatePropagation（）メソッドを使用できます。 jquery apiで説明によれば、stopImmediatePropagation（）メソッド

「が実行されるのハンドラの残りの部分を保持し、DOMツリーをバブリングから イベントを防止することができます。」

Answer 3

を...この提案は（oはtaphold

のjQueryを発射したjQueryオブジェクトであると仮定しo）.one（ 'タップクリック'、function（）{return false;}）;

1つのメソッドへのバインディングはイベントを1回だけ発生させます。 falseを返すと、それが< a>タグであれば、そのイベントの実行は停止します。

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

を次にあなたはこのようにそれを使用することができます：あなたがさえ定義する前に、単純にどこでもあなたの文書の先頭でこれを設定したり、

Answer 4

スワイプので

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

Answer 5

は、tapholdをトリガし、その後I

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

タップをサポートするには、次のようにすることをお勧めします。常に発火するタップイベントです。

Answer 6

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

}。

@Akash Budhia：あなたのソリューションに感謝します。 それは素晴らしいです、それは私のために働くと思う！

Answer 7

私はまだjquery-mobileのtapholdに問題があります.Tapholdの後に呼び出されるクリックの問題を解決し、要素にタイムアウトをかけました。 emitTapOnTaphold = falseのJQM 1.4。

例：

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

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