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