[JavaScript] keyup, keydown(feat. keypress)


プロジェクトを行う過程で、keyup、keydownをよく使うので、整理してみました.

keypress



現在のMDNでkeypressを検索すると、Depentedが表示されます.これはkeypressアクティビティをサポートしないことを意味します.Browser互換性を見ると、現在サポートされているブラウザは多いが、今後の最新ブラウザでは使用されない可能性が高いため、開発には使用しないほうがいい.

また、利用できるイベントは以下のようにおすすめします.

keydown


ユーザーがキーボードを押すとイベントが発生します.

event.isComposing


韓国語のように1文字を完成させ、何度もボタンを押すと、途中で実行活動が発生する.この場合、keyupを使用してイベントまたはeventを変更できます.isComposingを使用して問題を解決します.
input.addEventListener('keydoen', (e) => {
  if (e.isComposing) {
    return;
  }
  if (e.keyCode === 13) {
    onAdd();
  }
})

keyup


ユーザーがキーボードを離すと、イベントが発生します.

参考資料


MDN keypress event
Dream Code Ellibrowser 101教室