☰

onKeyPressとonKeyUpとonKeyDownの比較 質問する

tag-icon • tag-icon javascript dom dom-events
onKeyPressとonKeyUpとonKeyDownの比較 質問する

これら 3 つのイベントの違いは何でしょうか? Google で検索したところ、次のことがわかりました。

  • onKeyDownユーザーがキーを押すとイベントがトリガーされます。
  • onKeyUpユーザーがキーを放すとイベントがトリガーされます。
  • onKeyPressユーザーがキー ( ) を押して放すと、イベントがトリガーさonKeyDownれますonKeyUp。

最初の 2 つは理解できましたが、onKeyPressと同じではないですか? キー ( ) を押さずにonKeyUp放すことは可能ですか?onKeyUponKeyDown

ちょっとわかりにくいのですが、誰か説明してもらえませんか?

ベストアンサー1

NOTE KeyPressは現在非推奨代わりにを使用してくださいKeyDown。

KeyPress、およびKeyUpはKeyDown、それぞれ、ClickおよびMouseUp,と類似していますMouseDown。

  1. Down最初に起こる
  2. Press2番目に発生する（テキストが入力されたとき）
  3. Up最後に発生します（テキスト入力が完了したとき）。

例外はwebkitで、そこには追加のイベントがあります。

keydown
keypress
textInput     
keyup

以下は、イベントがいつ発生するかを自分で確認するために使用できるスニペットです。

window.addEventListener("keyup", log);
window.addEventListener("keypress", log);
window.addEventListener("keydown", log);

function log(event){
  console.log( event.type );
}

おすすめ記事