テキストエリアにおいて、キーボード周りのイベントを扱うプログラムを書いていたらドハマリした。
イベントがどのような順番で発火するのか調べたのでメモを残しておく。(特に結論はない)
キーボード周りのイベントは次に示す4つ。
- keydown
- keypress
- input
- keyup
この順番は崩れないのだが、発火したりしなかったりするキーが有る。それをまとめたのがこれ。
結果
Chrome | Firefox | IE | d | p | i | u | d | p | i | u | d | p | i | u |
---|---|---|---|---|---|---|---|---|---|---|---|---|
文字 | 1 | 2 | 3 | 4 | 1 | 2 | 3 | 4 | 1 | 2 | 3 | 4 |
enter | 1 | 2 | 3 | 4 | 1 | 2 | 3 | 4 | 1 | 2 | 3 | 4 |
特殊キー | 1 | 2 | 1 | 2 | 1 | 2 | ||||||
(IME ON)文字 | 1 | 2 | 3 | 1 | 1 | 2 | 3 | |||||
(IME ON)確定のEnter | 1 | 2 | 1 | 1 | 2 |
分かったこと(表から読み取れないことも書く)
- IME OFF時においてはどのブラウザも同じ結果となった。
- IME ONで共通していたのは、
keypress
は発火しないということ。それ以外はブラウザによってバラバラ
→この辺りを扱う場合はブラウザ間の挙動の差に注意 - ChromeとIEにおいては、IME ONの時に文字キーを打つと、keydown時のkeyCodeが「229」となる。
- OperaはChromeと同じ結果になった
- Inputイベントからはどう頑張っても押したキーは判別できない。
情報を列挙しただけど以上。