HTMLElement: input event

The input event fires when the value of an <input>, <select>, or <textarea> element has been changed.

The event also applies to elements with contenteditable enabled, and to any element when designMode is turned on. In the case of contenteditable and designMode, the event target is the editing host. If these properties apply to multiple elements, the editing host is the nearest ancestor element whose parent isn't editable.

For <input> elements with type=checkbox or type=radio, the input event should fire whenever a user toggles the control, per the HTML Living Standard specification. However, historically this has not always been the case. Check compatibility, or use the change event instead for elements of these types.

For <textarea> and <input> elements that accept text input (type=text, type=tel, etc.), the interface is InputEvent; for others, the interface is Event.

addEventListener("input", (event) => {});

oninput = (event) => {};

<input placeholder="Enter some text" name="name" />
<p id="values"></p>

const input = document.querySelector("input");
const log = document.getElementById("values");

input.addEventListener("input", updateValue);

function updateValue(e) {
  log.textContent = e.target.value;
}