8

タッチスクリーンを使用するjavascriptWebアプリケーションがあり、ブラウザーはWebkitベースです。

私はこれに問題があります：

addEventListener("mousedown", function(event){  
    console.log('down fired');
    event.target.classList.add('down');
}, true);

マウスを使用する場合、ターゲット要素クラスはマウスを押したままにするとすぐに追加されますが、タッチスクリーンを使用する場合、ターゲット要素クラスは指を要素に押したままにした場合は変更されません。

奇妙なことに、コンソールログメッセージは、マウスクリックとtsプレスの両方のダウンイベントで送信されます。

これを解決する方法についての提案はありますか？

ありがとう

編集

タッチスタートイベントリスナーを追加しましたが、タッチイベントで起動しません。

addEventListener("touchstart", function(event){ 
    cl('touch fired');
}, true);
4

3 に答える 3

16

遅すぎますが、他の誰かがそれを使用できるかもしれません:

event.target複数の指を使用できるため、タッチスクリーンでは機能しないため、より多くのターゲットがあります。

addEventListener("mousedown", function(event){  
  console.log('down fired');
  var t = /touch/.test(event.type) ? event.targetTouches[0] : event.target;
  t.classList.add('down');
}, true);
于 2014-07-22T08:16:29.260 に答える
5

代わりに、タッチスタートイベントとタッチエンドイベントを使用してください。

addEventListener("touchstart", function(event){  
    console.log('down fired');
    event.target.classList.add('down');
}, true);
于 2013-02-15T02:49:33.097 に答える
1

通常、タッチデバイスは期待どおりにマウスイベントを送信しますが、タッチスクリーン用の特別なイベントがあります。具体的には、「mousedown」に相当する「touchstart」、および「mouseup」に相当する「touchend」/「touchcancel」です。どのボタンまたは位置がタッチされているかを確認していない場合は、通常、それらを直接置き換えることができます。

ちなみに、タッチエンドとは、ユーザーが画面に触れるのをやめたことを意味します。touchcancelは、タッチを傍受する何かが発生したときに発生します（ブラウザー以外のアラートなど）。

于 2013-02-15T02:46:01.623 に答える