Ao usar jquery .change
em um input
evento, o evento será acionado apenas quando a entrada perder o foco
No meu caso, preciso fazer uma chamada para o serviço (verifique se o valor é válido) assim que o valor de entrada for alterado. Como eu pude fazer isso?
javascript
jquery
html
alma penada
fonte
fonte
Respostas:
ATUALIZADO para esclarecimentos e exemplo
exemplos: http://jsfiddle.net/pxfunc/5kpeJ/
Método 1.
input
EventoNos navegadores modernos, use o
input
evento. Este evento será acionado quando o usuário estiver digitando em um campo de texto, colando, desfazendo, basicamente, sempre que o valor for alterado de um valor para outro.No jQuery, faça isso assim
a partir do jQuery 1.7, substitua
bind
poron
:Método 2.
keyup
EventoPara navegadores mais antigos, use o
keyup
evento (isso será acionado assim que uma tecla do teclado for liberada), esse evento pode dar um tipo de falso positivo, porque quando "w" é liberado, o valor de entrada é alterado e okeyup
evento é acionado, mas também quando o A tecla "shift" é liberada, okeyup
evento é disparado, mas nenhuma alteração foi feita na entrada.). Além disso, esse método não é acionado se o usuário clicar e colar com o botão direito do mouse no menu de contexto:Método 3. Temporizador (
setInterval
ousetTimeout
)Para contornar as limitações,
keyup
você pode definir um cronômetro para verificar periodicamente o valor da entrada para determinar uma alteração no valor. Você pode usarsetInterval
ousetTimeout
fazer essa verificação do timer. Consulte a resposta marcada nesta pergunta do SO: evento de alteração da caixa de texto jQuery ou consulte o violino para obter um exemplo de trabalho usandofocus
eblur
events para iniciar e parar o cronômetro para um campo de entrada específicofonte
innerText
ouvalue
(simulando a entrada do usuário) acionará um evento MutationObserver jsfiddle.net/pxfunc/ 04chgpws / 1 (consulte o console.log para obter o log de eventos do MutationObserver). Você tem um caso de teste diferente para eu olhar?Se você possui HTML5:
oninput
(é acionado apenas quando uma alteração realmente acontece, mas ocorre imediatamente)Caso contrário, você precisará verificar todos esses eventos que possam indicar uma alteração no valor do elemento de entrada:
onchange
onkeyup
( nãokeydown
oukeypress
como o valor da entrada ainda não terá o novo pressionamento de tecla)onpaste
(quando suportado)e talvez:
onmouseup
(Eu não tenho certeza sobre este)fonte
Com HTML5 e sem usar o jQuery, você pode usar o
input
evento :Isso será acionado toda vez que o texto da entrada for alterado.
Suportado no IE9 + e em outros navegadores.
Experimente ao vivo em um jsFiddle aqui .
fonte
Como outros já sugeriram, a solução no seu caso é cheirar vários eventos .
Os plug-ins que executam esse trabalho geralmente ouvem os seguintes eventos:
Se você acha que podem se encaixar, você pode adicionar
focus
,blur
e outros eventos também.Sugiro não exceder nos eventos para escutar, pois ele carrega na memória do navegador procedimentos adicionais a serem executados de acordo com o comportamento do usuário.
Atenção: observe que alterar o valor de um elemento de entrada com JavaScript (por exemplo, através do
.val()
método jQuery ) não acionará nenhum dos eventos acima.(Referência: https://api.jquery.com/change/ ).
fonte
.val()
por exemplo, para um evento de alteração em um campo de entrada, você faria algo assim ...$('#element').val(whatever).change()
Se você deseja que o evento seja acionado sempre que algo for alterado dentro do elemento, você poderá usar o evento keyup .
fonte
onchange
ou acompanhar o estado por conta própria.keydown
não funciona porque é acionado antes que o estado da entrada seja alterado.// .blur é acionado quando o elemento perde o foco
// Para acionar manualmente, use:
fonte
Existem eventos jQuery, como keyup e keypress, que você pode usar com a entrada de elementos HTML. Você também pode usar o evento blur () .
fonte
keypress
evento porque a tecla pressionada ainda não alterou esse valor.Isso abrange todas as alterações em uma entrada usando o jQuery 1.7 e superior:
fonte