evento jQuery 'entrada'
Nunca había oído hablar de un evento llamado en jQuery inputhasta que vi este jsfiddle .
¿Sabes por qué está funcionando? ¿Es un alias keyupo algo así?
$(document).on('input', 'input:text', function() {});
Ocurre cuando el contenido del texto de un elemento se cambia a través de la interfaz de usuario.
No es exactamente un alias porque keyupse keyupactivará incluso si la tecla no hace nada (por ejemplo: presionar y luego soltar la tecla Control activará un keyupevento).
Una buena forma de pensarlo es así: es un evento que se activa cada vez que cambia la entrada. Esto incluye, entre otros, presionar teclas que modifican la entrada (por ejemplo, Ctrlpor sí sola no activará el evento, pero Ctrl-Vpegar algo de texto sí lo hará), seleccionar una opción de autocompletar, medio estilo Linux. -hacer clic en pegar, arrastrar y soltar y muchas otras cosas.
Consulte esta página y los comentarios sobre esta respuesta para obtener más detalles.
oninputEl evento es muy útil para realizar un seguimiento de los cambios en los campos de entrada.
Sin embargo, no es compatible con la versión de IE < 9. Pero las versiones anteriores de IE tienen su propio evento propietario onpropertychangeque hace lo mismo que oninput.
Entonces puedes usarlo de esta manera:
$(':input').on('input propertychange');
Tener un soporte completo para todos los navegadores.
Dado que el cambio de propiedad se puede activar para CUALQUIER cambio de propiedad, por ejemplo, se cambia la propiedad deshabilitada, entonces desea incluir esto:
$(':input').on('propertychange input', function (e) {
var valueChanged = false;
if (e.type=='propertychange') {
valueChanged = e.originalEvent.propertyName=='value';
} else {
valueChanged = true;
}
if (valueChanged) {
/* Code goes here */
}
});
Usando jQuery, los siguientes tienen efectos idénticos:
$('a').click(function(){ doSomething(); });
$('a').on('click', function(){ doSomething(); });
Sin embargo, con el inputevento, sólo el segundo patrón parece funcionar en los navegadores que he probado.
Por lo tanto, es de esperar que esto funcione, pero NO lo hace (al menos actualmente):
$(':text').input(function(){ doSomething(); });
Nuevamente, si desea aprovechar la delegación de eventos (por ejemplo, para configurar el evento #containerantes de que input.textse agregue al DOM), debería pensar en lo siguiente:
$('#container').on('input', ':text', function(){ doSomething(); });
Lamentablemente, nuevamente, ¡NO funciona actualmente!
Sólo este patrón funciona:
$(':text').on('input', function(){ doSomething(); });
EDITADO CON MÁS INFORMACIÓN ACTUAL
Ciertamente puedo confirmar que este patrón:
$('#container').on('input', ':text', function(){ doSomething(); });
AHORA FUNCIONA también en todos los navegadores "estándar".
