web-dev-qa-db-ja.com

jQuery mobileでは、tapとvclickの違いは何ですか？

どのイベントを使用して聞く必要がありますか？なぜvclickを使用するのですか？どの状況でどの状況を使用すればよいかわかりません。

javascriptjqueryhtmlcssjquery-mobile
15
lovespring

JQuery Mobile Tapの場合、モバイルデバイスでのみ機能していました。これはもはや当てはまりません。

VClickは、デスクトップ/モバイルデバイス間のクリック/タップの非互換性の間のギャップを埋めるために作成されました。

今ではタップを自由に使うことができますが、問題はほとんどありません。 iOSプラットフォームではタップが失敗します。代わりにタッチスタートを使用する必要があります。

例：

VClick

デスクトップデバイスとモバイルデバイスの両方で動作します。

  • Android4.1.1-遅延なし
  • iOS-遅延なし
  • デスクトップFirefox19＆Chrome 25.0.1364.152-遅延なし

http://jsfiddle.net/Gajotres/PYPXu/embedded/result/

$(document).on('pagebeforeshow', '#index', function(){       
    $( document ).on( "vclick", '[data-role="page"]', function() {
        $( this ).append( "<span style='color:#00F;'>vmouseup fired.</span>" );
    });
});

タップ：

タップ

以前はモバイルデバイスでのみ機能していましたが、現在はデスクトップブラウザーでも機能しますが、jQueryMobileバージョン1.1以下のiOSでは失敗します。

  • Android4.1.1-遅延なし
  • iOS-遅延なし
  • デスクトップFirefox19＆Chrome 25.0.1364.152-遅延なし

http://jsfiddle.net/Gajotres/k8kSA/

$(document).on('pagebeforeshow', '#index', function(){       
    $( document ).on( "tap", '[data-role="page"]', function() {
        $( this ).append( "<span style='color:#00F;'>tap fired.</span>" );
    });
});

クリック

モバイルデバイスとデスクトップブラウザで動作します。

  • Android 4.1.1-目に見える遅延（300ミリ秒以上）
  • iOS-遅延なし
  • デスクトップFirefox19＆Chrome 25.0.1364.152-遅延なし

http://jsfiddle.net/Gajotres/L2FHp/

$(document).on('pagebeforeshow', '#index', function(){       
    $( document ).on( "click", '[data-role="page"]', function() {
        $( this ).append( "<span style='color:#00F;'>click fired.</span>" );
    });
});

結論

VClickを使用した後方jQM互換性スティックが必要な場合は、Tapを使用します。

43
Gajotres

vclick（仮想化クリック）は、onclickイベントをシミュレートします。

http://api.jquerymobile.com/vclick/

タップイベントは、単一のターゲットオブジェクトをすばやく完全にタッチイベントした後にトリガーされます。

http://api.jquerymobile.com/tap/

それはあなたがしていることに依存しますが、あなたがそうしない特別な理由がない限り（例えば、同じjsでデスクトップとモバイルをサポートする）、私はタップを使います。

詳細はこちら https://coderwall.com/p/bdxjzg

2
DalSoft

「tap」と「vclick」の大きな違いに気づきました。ボタンにタブで移動してEnterキーを押すと「vclick」が発生します-「tap」は発生しません。

2
Jules