DOMイベントの優先順位
-
08-07-2019 - |
質問
JavaScriptでイベントが処理される優先順位はどのようなものですか?
イベントをアルファベット順に示します...
- onabort-画像の読み込みは 中断
- onblur-要素はフォーカスを失います
- onchange-ユーザーは フィールドの内容
- onclick-マウスがオブジェクトをクリックする
- ondblclick-マウスでダブルクリック オブジェクト
- onerror-エラーが発生するのは 文書または画像の読み込み
- onfocus-要素がフォーカスを取得
- onkeydown-キーボードのキーは 押された
- onkeypress-キーボードキーは 押したまままたは押したまま
- onkeyup-キーボードキーは リリース
- onload-ページまたは画像は 読み込みが完了しました
- onmousedown-マウスボタンは 押された
- onmousemove-マウスを移動します
- onmouseout-マウスを離します 要素
- onmouseover-マウスが移動します 要素の上
- onmouseup-マウスボタンは リリース
- onreset-リセットボタンは クリック
- onresize-ウィンドウまたはフレームは サイズ変更
- onselect-テキストが選択されている
- onsubmit-送信ボタンは クリック
- onunload-ユーザーはページを終了します
イベントキューから処理される順序は何ですか?
優先順位は先入れ先出し(FIFO)ではないかと思います。
解決
これは、私が知る限り、過去に明示的に定義されていませんでした。さまざまなブラウザは、イベントの順序付けを自由に実装できますが、適切と思われます。ほとんどはすべての実用的な目的に対して十分に近いものですが、ブラウザが多少異なる奇妙なエッジのケースがあります(もちろん、特定のブラウザが特定のイベントをまったく送信できない多くのケースがありますem>)。
とはいえ、 HTML 5ドラフト勧告は、イベントをキューに入れてディスパッチする方法を指定しようとします-イベントループ:
イベントを調整するには、ユーザー 相互作用、スクリプト、レンダリング、 ネットワーキングなどのユーザーエージェント で説明されているイベントループを使用する必要があります このセクション。
少なくとも1つのイベントループが必要です ユーザーエージェントごと、最大1つのイベント 関連の単位ごとのループ 類似オリジンブラウジングコンテキスト。
イベントループには1つ以上のタスクがあります キュー。タスクキューは順序付けられています タスクのリスト[...] ユーザーエージェントがタスクをキューに入れる場合、 指定されたタスクを次のいずれかに追加する必要があります 関連するイベントのタスクキュー ループ。 1つのすべてのタスク 特定のタスクソースは常に 同じタスクキューに追加されましたが、 異なるタスクソースからのタスクは 異なるタスクキューに配置されます。 [...]
[...]ユーザーエージェントは1つのタスクキューを持つことができます マウスおよびキーイベント(ユーザー インタラクションタスクソース)、および別の 他のすべてのために。ユーザーエージェント その後、キーボードとマウスを与えることができます 他のタスクよりもイベント設定 四分の三の時間 インターフェイスは応答しますが、応答しません 他のタスクキューを飢えさせ、決して 任意の1つのタスクからのイベントの処理 ソースが故障しています。 [...]
最後のビットに注意してください:どのイベントをグループ化して順番に処理するか、また特定のタイプのイベントに与えられる優先度を決定するのはブラウザの実装次第です。したがって、現在または将来、すべてのブラウザが all イベントを決まった順序でディスパッチすることを期待する理由はほとんどありません。
他のヒント
シーケンスの相対イベントが呼び出されることを知りたい場合は、以下を参照してください。これまでのところ、Chromeでしかテストしていません。
- マウスオーバー
- mousemove
- マウスアウト
- mousedown
- 変更(フォーカスされた入力)
- ぼかし(フォーカスされた要素上)
- フォーカス
- マウスアップ
- クリック
- dblclick
- キーダウン
- キープレス
- keyup
マウス/タッチイベントを見ている場合、Patrick H. Laukeがトークを公開しています件名。間違いなく興味深い読み物であり、さまざまなブラウザー、さまざまなデバイス、さまざまな標準のすべての癖を扱っています。
彼は、包括的なテストセットもバンドルしています。