javascript onkeydownでテキストフォームに入力時の値が1回ずれて表示される

javascript onkeydownでテキストフォームに入力時の値が1回ずれて表示される

javascriptで、onkeydownでテキストフォームに入力時の値が1回ずれて表示される原因を掲載してます。ブラウザはchromeを使用しています。

環境

  • OS windows10 pro 64bit
  • Apache 2.4.43
  • ブラウザ chrome 84.0.4147.105

実行コード

onkeydownを使用した以下のコードを実行すると、入力したデータが1つずつずれて表示されます。

実行結果

原因

これは、 「onkeydown」イベントは、キーを押す直前のテキストフォームの値を取得するためです。

対処法

「onKeyUp」イベントを使用します。

実行結果

また、「onkeydown」イベントも、キーを押す直前のテキストフォームの値が取得されます。

実行結果