jquery - 特定のタッチイベントによって複数のイベントが発生しますが、目的のイベントに制限するにはどうすればよいですか？

Question

したがって、タップまたはタップホールドすると期待どおりに機能しますが、スワイプすると2つのイベントが発生するはずです。スワイプとスワイプ方向ですが、タップイベントも発生します。スワイプまたはスワイプ方向が発生した場合にタップイベントを削除する方法はありますか？

実例：

• http://jsfiddle.net/phillpafford/hJtAQ/11/

HTML：

<div data-role="page" id="home"> 
    <div data-role="content">
        <div id="display-event" class="add-border">
            <p>Tap, TapHold (for 1 second), Swipe, SwipeRight or SwipeLeft</p>
        </div>
    </div>
</div>

JS：

function bindEvent(element) {
    element.bind('tap taphold swipe swiperight swipeleft', function(event, ui) {
       alert('Event: '+event.type); 
    });
}

bindEvent($('#display-event'));

関連する質問：スワイプイベントはiPodtouchのタップイベントをトリガーします

更新： -http: //jsfiddle.net/hJtAQ/31/（Jaspersメソッドを使用）

Answer 1

発生する最初のイベントのみを検証する場合は、タイムアウトを設定し、発生するpreventDefault()残りのイベントに対して次のようにします。

function bindEvent(element) {
    element.bind('tap taphold swipe swiperight swipeleft', function(event, ui) {
       if (event_ok == false) {
           event.preventDefault();
           return false;
       } else {
           event_ok = false;
           setTimeout(function () {
               event_ok = true;
           }, 500);
           alert('Event: '+event.type);
       }
    });
}

var event_ok = true;
bindEvent($('#display-event'));