JavaScriptのkeydownとkeypressの違い

phiary に引っ越しました. 毎日プログラミングやWebに関する情報を発信しています! RSS 登録してたまに覗いたり, tweet やハテブして拡散してもらえると幸いです.

Pocket

よく 「keydownは押している間呼ばれ続けて、keypressは押した瞬間のみ呼ばれる」 なんて記事を目にするが、どうやらブラウザによって違うらしい。

ちなみに、私のメインブラウザであるChromeの場合、 押している間、どちらも呼ばれ続けた。

色々と実験した結果をちょっとまとめてみる。(Chromeの場合のみ)

keydown

  • keyCodeに結果が入る

keypress

  • ASCIIの場合charCodeに、それ以外の場合keyCodeに結果が入る
  • 日本語入力(IME)には反応しない

共通

  • 押している間呼ばれ続ける
  • shift, ctrl, altについては、bool値が入っている
  • event.shiftKey, event.ctrlKey, event.altKeyで判定できる。

まとめ

自分のサイトに独自にショートカット機能を割り当てたり、
JavaScriptでゲームを作ったりする場合はkeydownを使う。

タイピングソフトなどのASCIIの結果のみを使いたい場合はkeypressを使う。

で良い気がする。

ちなみに、キーイベントの呼ばれる順番は、
keydown→keypress→keyupである。

参考サイト

TRACK BACK URL

POST COMMENT

メールアドレスが公開されることはありません。

COMMENT