Cuando se usa jquery .change
en un input
evento, solo se disparará cuando la entrada pierda el foco
En mi caso, necesito hacer una llamada al servicio (verificar si el valor es válido) tan pronto como se cambie el valor de entrada. ¿Cómo podría lograr esto?
javascript
jquery
html
Banshee
fuente
fuente
Respuestas:
ACTUALIZADO para aclaraciones y ejemplos
ejemplos: http://jsfiddle.net/pxfunc/5kpeJ/
Método 1.
input
eventoEn los navegadores modernos, use el
input
evento. Este evento se disparará cuando el usuario esté escribiendo en un campo de texto, pegando, deshaciendo, básicamente en cualquier momento que el valor cambie de un valor a otro.En jQuery haz eso así
comenzando con jQuery 1.7, reemplace
bind
conon
:Método 2.
keyup
eventoPara navegadores más antiguos, use el
keyup
evento (esto se disparará una vez que se haya soltado una tecla del teclado, este evento puede dar una especie de falso positivo porque cuando se libera "w" el valor de entrada cambia y elkeyup
evento se dispara, pero también cuando Se suelta la tecla "shift" cuando sekeyup
dispara el evento pero no se ha realizado ningún cambio en la entrada). Además, este método no se activa si el usuario hace clic derecho y pega desde el menú contextual:Método 3. Temporizador (
setInterval
osetTimeout
)Para evitar las limitaciones
keyup
, puede configurar un temporizador para verificar periódicamente el valor de la entrada para determinar un cambio en el valor. Puede usarsetInterval
osetTimeout
para hacer esta verificación del temporizador. Vea la respuesta marcada en esta pregunta SO: evento de cambio de cuadro de texto jQuery o vea el violín para ver un ejemplo de trabajo usandofocus
yblur
eventos para iniciar y detener el temporizador para un campo de entrada específicofuente
innerText
ovalue
(simulando la entrada del usuario) activará un evento MutationObserver jsfiddle.net/pxfunc/ 04chgpws / 1 (consulte el archivo console.log para el registro de eventos de MutationObserver). ¿Tiene un caso de prueba diferente que pueda ver?Si tienes HTML5:
oninput
(se activa solo cuando se produce un cambio, pero lo hace de inmediato)De lo contrario, debe verificar todos estos eventos que podrían indicar un cambio en el valor del elemento de entrada:
onchange
onkeyup
( nokeydown
okeypress
ya que el valor de la entrada todavía no tendrá la nueva pulsación de tecla)onpaste
(cuando sea compatible)y tal vez:
onmouseup
(No estoy seguro de esto)fuente
Con HTML5 y sin usar jQuery, puede usar el
input
evento :Esto se disparará cada vez que cambie el texto de la entrada.
Compatible con IE9 + y otros navegadores.
Pruébalo en vivo en un jsFiddle aquí .
fuente
Como otros ya sugirieron, la solución en su caso es detectar múltiples eventos .
Los complementos que realizan este trabajo a menudo escuchan los siguientes eventos:
Si usted piensa que puede encajar, puede agregar
focus
,blur
y otros eventos también.Sugiero no exceder en los eventos para escuchar, ya que carga en la memoria del navegador más procedimientos para ejecutar de acuerdo con el comportamiento del usuario.
Atención: tenga en cuenta que cambiar el valor de un elemento de entrada con JavaScript (por ejemplo, mediante el
.val()
método jQuery ) no activará ninguno de los eventos anteriores.(Referencia: https://api.jquery.com/change/ ).
fuente
.val()
ejemplo para un evento de cambio en un campo de entrada, que haría algo como esto ...$('#element').val(whatever).change()
Si desea que se active el evento cada vez que se cambia algo dentro del elemento, puede usar el evento keyup .
fuente
onchange
o rastrear el estado tú mismo.keydown
no funciona porque se dispara antes de que cambie el estado de la entrada.// .blur se activa cuando el elemento pierde el foco
// Para disparar manualmente, use:
fuente
Hay eventos jQuery como keyup y keypress que puede usar con elementos HTML de entrada. También puede usar el evento blur () .
fuente
keypress
evento porque la tecla presionada aún no habrá cambiado ese valor.Esto cubre cada cambio en una entrada usando jQuery 1.7 y superior:
fuente