イベントのkeyCodeとcharCode
イベントのキーコードの取得には
event.keyCode
event.charCode
の二種類があるんだが、keypress
イベントとkeydown
イベントとで出方が違うことに気付いた。
keypress
とkeydown
の表す数値は以下の通り
keyCode
にはキーを表す特殊コードを表す数値として出る*1charCode
にはASCII文字コード表に対応した10進数として出る
以下に幾つか試した結果を書くので参考に。ただ、特殊キーに当たりそうな(ex. windows,無変換, IMEオン時の挙動)ものは環境によって異なりそうなので注意。
keypress
- ASCII文字コードとして認識できるものは
charCode
に出る - そうでないものは
keyCode
に出る - IMEオン時にイベントが挙がることは期待できない((
keyCode
に229
で挙がる時と挙がらない時があった))
押したキー | charCode |
keyCode |
備考 |
a | 97 | 0 | "a" |
Shift+a | 65 | 0 | "A" |
Alt | イベント挙がらず | ||
ESC | 0 | 27 | DOM_VK_ESCAPE |
SPACE | 32 | 0 | " " |
↓ | 0 | 40 | DOM_VK_DOWN |
F1 | 0 | 112 | DOM_VK_F1 |
windowsキー | 0 | 91 | 対応なし |
無変換 | 0 | 29 | 対応なし |
keydown
keyCode
に出て、charCode
には出ない- 同時に複数の文字を押下しても別々にイベントが挙がる
- IMEオン時にも押されたキーに対応する
keyCode
で挙がる
押したキー | charCode |
keyCode |
備考 |
a | 0 | 65 | DOM_VK_A |
Shift | 0 | 16 | DOM_VK_SHIFT |
Alt | 0 | 18 | DOM_VK_ALT |
ESC | 0 | 27 | DOM_VK_ESCAPE |
SPACE | 0 | 32 | DOM_VK_SPACE |
↓ | 0 | 40 | DOM_VK_DOWN |
F1 | 0 | 112 | DOM_VK_F1 |
windowsキー | 0 | 91 | 対応なし |
無変換 | 0 | 29 | 対応なし |
まとめ?
IMEオン時とAlt以外は、まぁどちらでやっても大差無さそうだ。Shift,Ctrl,Altに関しては、event.shiftKey
,event.ctrlKey
,event.altKey
で真偽値を取れるし。
また、
onkeydown
The keydown event is sent to an element that has the focus and a key is pressed but not released.
onkeypress
The keypress event is sent to an element that has the focus and a key is pressed and released. When the user presses a key, the keydown event is first sent, followed by the keypress event and then the keyup event. In a textbox, a user normally can hold down a key to repeat a character In this case, multiple sets of key events are sent as if the user rapidly pressed the same key repeatedly.
と書かれている通り、keydown
イベントの方が先に挙がる。
追記
そういえば、オイラはkeydown
イベントを勘違いしていた。mousedown
イベントと同様にキーが押された瞬間に出るだけで、押し続けていた場合には出ないと思っていたんだが、keypress
,keydown
、どちらも押し続けているとイベントがドカドカ挙がるみたい。困ったものだ。