Evento input

El evento input se dispara cuando el valor (value) de un elemento <input>, <select>, o <textarea> ha sido cambiado. 

Burbujas Yes
Cancelable No
Interfaz InputEvent (en-US)
Objectivo Element
Acción por defecto None
Propiedad del manejador del evento GlobalEventHandlers.oninput

El evento también aplica a los elementos con la propiedad contenteditable habilidado, y para cualquier otro elemento cuando la propiedad designMode esta encendida. En el caso de un contenteditable y designMode, el objetivo del evento es el  the event target is the editing host. Si estas propiedades aplian a múltiples elementos, el host de edición es el elemento ancestro más cercano cuyo padre no es editable.

Para elementos <input> con type=checkbox o type=radio, el evento input debería disparar cuando el usuario alterna el control, por la especificación HTML5. Sin embargo, históricamente no siempre es el caso. Revise la compatibilidad o use el evento change (en-US) en su lugar para estos tipos.

Nota: A diferencia de input, el evento change (en-US) no es disparado necesariamente por cada alteración al valor (value) de un elemento.

Ejemplos

Este ejemplo registra el valor siempre que se cambia el valor del elemento <input>.

HTML

<input placeholder="Ingrese algún texto" name="nombre"/>
<p id="valores"></p>

JavaScript

const input = document.querySelector('input');
const log = document.getElementById('valores');

input.addEventListener('input', updateValue);

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

Resultado

(Funciona en la versión en inglés)

Especificaciones

Especificación Estado
HTML Living Standard
La definición de 'input event' en esta especificación.		 Living Standard
Document Object Model (DOM) Level 3 Events Specification
La definición de 'input event' en esta especificación.		 Obsolete

Compatibilidad de los navegadores

No compatibility data found for api.HTMLElement.input.
Check for problems with this page or contribute missing data to mdn/browser-compat-data.

Ver también