jQuery – Ejecutar función cuando cambie contenido de un textbox

¿Cómo ejecutar una función cuando cambia el contenido en un textbox en un formulario web? Veamos el artículo jQuery – Ejecutar función cuando cambie contenido de un textbox.

Hay diferentes formas de hacerlo. Veamos tres de las formas posibles de capturar el cambio de contenido en un textbox de un formulario:

Cambio contenido en textbox con JavaScript

<input id="mitexto" onchange="tufuncion();" onkeyup="this.onchange();" onpaste="this.onchange();" oninput="this.onchange();"/>

De esta manera, dentro del formulario, llamamos las función a ejecutar cuando se produce diversas acciones (change, key, paste o input).

Cambio contenido textbox – Change

$('#mitexto').change(function() {
...
});

Se captura la acción onchange con jQuery del textbox con id mitexto. En la parte inferior tenéis un enlace con más información sobre la función onChange de jQuery.

Cambio contenido textbox – On

$('#mitexto').on('input', function(e){
...
});

Se captura la acción input con jQuery del textbox con id mitexto.

Cambio contenido textbox – On múltiple

$("#mitexto").on("change keyup paste click", function(){
...
});

Si buscáis en Google, veréis que los casos a utilizar dependerá el contexto en el que lo hagáis. El más completo es el último ejemplo, dónde se trata el cambio, se trata cuando se escribe o copia contenido en el textbox o cuándo se pulsan teclas en el textbox.

Espero que os haya sido de utilidad el artículo jQuery – Ejecutar función cuando cambie contenido de un textbox.


Más información