form の input の入力値を取得するには、input への入力のイベント「input イベント」または「change イベント」を利用します。
「input イベント」⇒input エリアに文字を入力するたびに発火します。
「change イベント」⇒input エリアに文字を入力して Enterキーを押すと発火します。
●要素の属性値にイベントハンドラを登録する場合は 「oninput 属性」または「onchange 属性」を使用します。
<input type="text" name="test1" oninput="inputChange01()"> <input type="text" name="test3" onchange="inputChange02()">
●addEventListener を使用して、イベントハンドラを登録する場合
input.addEventListener('input', inputChange); input.addEventListener('change', inputChange2);
●引数 event で、入力された値を取得することができます。
・「oninput 属性/イベント」
et inputChange = (e) => { text_val.textContent = e.currentTarget.value; //テキストエリアに入力されたテキスト input_val.textContent = e.data; //今、入力されたテキスト }
・「change 属性/イベント」
et inputChange = (e) => { text_val.textContent = e.currentTarget.value; //テキストエリアに入力されたテキスト }