26

カスタム ドロップダウンの問題に答えようとしていましたが、Chrome と Firefox で一貫性のない動作に挑戦しました。

DEMO: http://jsfiddle.net/fyeht/ [わかりやすくするためにスクロール イベントを追加]

下の画像を参照してください。リスト項目は矢印キーを使用して移動できます。

問題を再現するには:

  1. Chrome でコンソールを開く ( F12)
  2. リスト内の項目をクリックします (いくつかのイベントがコンソールに記録されます)。
  3. リスト内の次の項目に移動するには、下矢印キーを使用します
  4. 最後に、ビューの最後の項目に到達し、下向き矢印を押すとスクロールすると問題が発生します。ログをチェックして、「スクロール」、「マウス入力」、および「マウス移動」を確認してください [新しいデモをチェックしてください]

問題は、表示されているアイテムの最後に到達した後、スクロールすることです。マウスは触れていませんが、Chromeでトリガーmouseenterおよびイベントが発生します。mousemoveFF では、スクロール時にmouseenter意味のあるものだけがトリガーされます。

ここに画像の説明を入力

質問:

  • mousemoveマウスが触れられていないときにトリガーされるのはなぜですか?
  • これは単なるブラウザの不一致ですか? スクロール時にトリガーされるイベントに関するドキュメントが見つかりませんか? （それがあったことを決して知らなかった）

バグレポートを提出しました: https://code.google.com/p/chromium/issues/detail?id=241476

4

4 に答える 4

1

これはバグではありません。mousemove は、イベントが関連付けられている要素に対して相対的です。あなたの場合、ブラウザ ウィンドウを参照したため、マウスが動いていないことがわかります。しかし、そのスクロールリストの場合、リストがスクロールされるたびに、リストの一部の要素を指しているマウスが別の要素に移動しました

あなたが地球であり、一杯のコーヒーがマウスとしてテーブルの上に静止しており、スクロール可能なリストが太陽であると想像してください。あなた (ウィンドウ) が動かなければ、コーヒー (マウス) の位置はあなたのための同じ場所; しかし、太陽 (​​リスト) については、地球とコーヒー カップの両方が動いていることがわかります。

于 2013-05-22T21:27:33.830 に答える
1

ここにブラウザの不一致があるとは思えません。x 座標と y 座標を出力する mousemove イベントを作成する必要があります。おそらく、マウスが実際に少し動いていることがわかるでしょう。その場合は、プラグイン hoverIntent を使用して、このような問題を解消してみてください。

編集：

上下の矢印キーを使用して、問題を再現できるようになりました。ええ、それは確かにある種のバグのように見えます! mousemove 座標のデルタは小さいに違いありません。カーソルが 1 ～ 2 ピクセル移動するのでしょうか。これを克服するには、以前の mousemove の xy 座標を現在の mousemove の xy 座標と比較するチェックを mousemove 関数に追加します。数ピクセル以上かどうかを判断します。もしそうなら、あなたはそれが本当のマウスムーブであることを知っています. 少ない場合は、クロムのバグとしてチョークで書き留めることができます。

さらに編集：

おそらく本来あるべきではないときに、chromeでmousemoveが起動されるバグを発見したようです。十分にハックすれば解決できる回避策があるかもしれません。しかし、最善の解決策は、この状況で mousemove を使用しないことです。一般に、mousemove は、本当に必要な場合にのみ使用する必要がある高価なイベントの 1 つです。

于 2013-05-16T01:24:52.163 に答える