12

私は以前に依存していました

var supportsTouch = 'ontouchstart' in document;

モバイルおよびデスクトップブラウザでのタッチサポートをテストします。そのテストに基づいて、eventListenersをクリックイベントまたはタッチイベントにバインドします。これは現在のすべてのブラウザバージョンで正常に機能しますが、Chrome Canaryの最新のアップデート（24.0.1275.0カナリア）ともちろんDEVバージョンはこのテストに失敗します。

現在のmodernizrテストを確認しましたが、誤検知も返されます。つまり、機能が無効になっている場合でも、Chromeはタッチをサポートしていると表示されます。

私の現在の回避策は、最初にあらゆる種類のモバイルブラウザーをテストし、それが陽性を返した場合にのみ、上記のテストを使用してタッチをチェックすることです。これの欠点は、chromeのdev-toolsで便利な「タッチイベントをエミュレートする」オプションを使用できないことです。アイデア？

4

1 に答える 1

17

簡単な答え:現在の Chrome でテストが再び機能するようになりました。しかし、おそらく永遠ではありません。

長い答え:

タッチ対応の画面を備えたデスクトップの数が増えているため、Chrome チームはデスクトップ ブラウザーにタッチ イベントを追加したいと考えていました。彼らはそうしました - おそらく 24.0 Canary の頃です。彼らは、「タッチデバイスを検出する」ためにあなたがしていることを多くの人が行っていることを発見しました. これに関する問題は、ブラウザがデバイスではなくタッチ イベントをサポートしているかどうかのみをテストしていることです(同じことが にも当てはまりますModernizr.touch)。具体的には、W3C/Apple TouchEvents API のみです。

彼らは、タッチ/非タッチ用に異なるバージョンの Chrome を出荷したくなかったので、起動時にタッチ デバイスを検出した場合にのみタッチ API を有効にするようにしました (ここで説明します: http://code.google.com /p/chromium/issues/detail?id=152149 )。

これで、テストが再び機能するようになります... しかし、将来的に自分自身を証明したい場合は、アプローチを変更することをお勧めします。理由は次のとおりです。

  1. すべてのブラウザが、Chrome が行うこの切り替えを実行するわけではありません。

  2. タッチ機能は動的な機能になりつつあります。Microsoft Surface などでは、キーボードとマウスを取り外してタッチのみにすることができます。ユーザーは、起動時に検出されない KVM スイッチを介して接続されたタッチ モニターを使用している場合があります。ブラウザ ベンダーはそうではありません。 API を表示したり非表示にしたりしたい - それは悪夢です - ある時点で、Chrome の担当者はおそらくすべてのデバイスで TouchEvents API を永続的に有効にするでしょう。そのテストは再び「誤検知」をスローし始めます。

代わりに、マウス、タッチ、およびスタイラス入力に共通のイベント インターフェイスを提供するPointerEvents APIを見てください。タッチ インターフェースなどのボタンを大きくすることを考えている場合は、ポインタ メディア クエリ仕様 (およびホバー1) もあり、これはブラウザに間もなく表示されます - これにより、入力デバイスのさまざまな精度noneが区別されます - / coarse/ fine- 動的であること接続/切断されているように、接続されているポインター デバイスに基づいてスタイルを調整できます。とてもかっこいい。

Modernizr v3.0 (今後数週間以内にリリース) には、いくつかの関連する変更が含まれます。

  • PointerEvents API の検出が追加されています
  • Modernizr.touchModernizr.touchevents意味をよりよく表すために名前が変更されています

したがって、利用可能な場合は PointerEvents を使用することを検討し (既に IE10 に含まれています)、Modernizr.toucheventsそうでない場合はスイッチにフォールバックします。

于 2013-01-29T08:48:59.657 に答える