JavaScript テキストエリア(textarea)の入力イベントを実装するサンプル

環境
Google Chrome 111.0.5563.65
Windows 10 Home 64bit

書式
let 変数名 = document.querySelector(`textarea`);
変数名.addEventListener('keyup’, () => {
テキストエリアのイベントの登録を行います

使用例

<!DOCTYPE html>
<html>
<body>

<textarea cols="20" rows="5"></textarea>
<p id="result"></p>

<script>
 let cft = document.querySelector(`textarea`);
 cft.addEventListener('keyup',()=>{
 // キーが離れた時イベント
  document.querySelector(`#result`).innerHTML = cft.value;

})

</script>

</body>
</html>

実行結果
テキストエリアに「tokyo」と入力すると、要素「id="result"」にtokyoを出力します。

JavaScript

Posted by arkgame