JS DOM: Input Text Field

By Xah Lee. Date: . Last updated: .

Input Text Field Example

Result:

Code

<div class="mKvVM">
<label for="inputText09586">Name:</label>
<input id="inputText09586" type="text" size="20" maxlength="20" name="user_name" value="" placeholder="Enter name...">
</div>

<div class="mKvVM">
Result:
<span id="showBox30022"></span>
</div>
{
 const inputText09586 = document.getElementById("inputText09586");
 const showBox30022 = document.getElementById("showBox30022");

 const f_update = () => {
  showBox30022.textContent = inputText09586.value;
 };

 inputText09586.addEventListener("input", f_update);

 f_update();
}

HTML Input tutorial