web-dev-qa-db-ja.com

jQuery mobile-すべてのライブタップイベントに対して、同等のクリックイベントが必要ですか？

応答性を向上させるために、jQueryライブクリックイベントをjQueryモバイルタップイベントに置き換えました。

これは互換性の理由から悪い考えだと思います。

両方のイベントが必要であり、同じ関数に対して両方を書き込む方法はありますか？

（「クリック」、「タップ」など）

jqueryjquery-selectorsjquery-mobile
26
TaylorMac

ビリーの答えは信じられないほど完全であり、私が実際に使用した数回はかなりうまくいきました。ただし、 JQuery Mobile でvmouseプラグインを確認することもできます。これは、マウスイベントを抽象化する試みです。

 // This plugin is an experiment for abstracting away the touch and mouse
 // events so that developers don't have to worry about which method of input
 // the device their document is loaded on supports.

- https://github.com/jquery/jquery-mobile/blob/master/js/vmouse.js

自分が取り組んでいるプロジェクトでそれをいじっていますが、最近はかなり反応がいいようです。使用するには、次のようなもの：

$('selector').bind('vclick', function () { ...

または

$('selector').bind('vmousedown', function () { ...
34
J.T.Sage

次のように、1回の呼び出しで複数のイベントをバインドできます。

$('selector').bind('click tap',function(){ ... })

これは一部のブラウザー/モバイルでは問題ないかもしれませんが、タップとクリックの両方をトリガーする一部のデバイスでイベントが2回発生する可能性があります。

何らかのデバイス/機能の検出を行い、このような適切なハンドラーを追加するだけでこれを修正できます...

$('selector').bind( myCustomDetectionFunction() ? 'click' : 'tap' ,function(){ ... })

さらに、私はtouchstartとmousedownを選択する方が良いイベントだと思います。これは、システムが2回目のタッチでダブルクリックしたり、スワイプジェスチャーになったりする可能性があるため、タッチ後、遅延が経過するまでクリックイベントが発生しないためです。 touchstartイベントはmousedownと同様に即座に起動するため、応答性が向上します。

30
Billy Moon

その問題を解決する小さなスクリプトを開発しました。それをグローバルレベルで含めるだけで、遅延イベントの問題なくクリックイベントがすぐに発生します。

https://github.com/cargomedia/jquery.touchToClick

10
Marcel Colomb

JQuery mobileにはすでにそれを行うイベントがあるようです：

$(function(){
    $('selector').bind('vclick', function(e){
        alert('test');    
        return false;
    });
});
4
h3.

JQueryからvmouseプラグインを使用できます。これにより、クリックイベント（モバイルのみ）、およびクリックイベントとタッチイベントの両方がトリガーされる場合の300ミリ秒の遅延が解決されます。

Vmouseプラグインのみを取得するには、 jQuery Mobile Download Builder を使用します。 jQueryの後、このプラグインに依存するスクリプトの前に含めます。

関連するイベントは vclick であり、基本的な使用法は次のとおりです。

$(".selector").on( "vclick", function( event ) {
    // To execute
});
2
user2449231