Eu estou usando um keypress
ouvinte, por exemplo ..
addEventListener("keypress", function(event){
}
No entanto, isso não parece detectar um backspace que apaga o texto ...
Existe um ouvinte diferente que eu possa usar para detectar isso?
javascript
keypress
addeventlistener
Skizit
fonte
fonte
keypress
eventos em muitos navegadores. Veja unixpapa.com/js/key.htmlTente em
keydown
vez dekeypress
.Os eventos de teclado ocorrem nesta ordem:
keydown
,keyup
,keypress
O problema do backspace provavelmente é que o navegador voltará a navegar
keyup
e, portanto, sua página não verá okeypress
evento.fonte
keydown
keypress
keyup
. unixpapa.com/js/testkey.htmlkeyup
evento seja disparado.keydown
evento, mas o caractere não é removido da entrada até algum tempo depois.O
keypress
evento pode ser diferente nos navegadores.Criei um Jsfiddle para comparar eventos de teclado (usando os atalhos do JQuery) no Chrome e Firefox. Dependendo do navegador que você está usando, um
keypress
evento será acionado ou não - o backspace será acionadokeydown/keypress/keyup
no Firefox, mas apenaskeydown/keyup
no Chrome.Eventos de clique de tecla únicos acionados
no Chrome
keydown/keypress/keyup
quando o navegador registra uma entrada do teclado (keypress
é acionada)keydown/keyup
se nenhuma entrada de teclado (testada com alt, shift, backspace, teclas de seta)keydown
apenas para guia?no Firefox
keydown/keypress/keyup
quando o navegador registra uma entrada do teclado, mas também para backspace, teclas de seta, guia (então aquikeypress
é acionado mesmo sem entrada)keydown/keyup
para alt, shiftIsso não deveria surpreender, porque de acordo com https://api.jquery.com/keypress/ :
O uso do tipo de evento de pressionamento de tecla foi descontinuado pelo W3C ( http://www.w3.org/TR/DOM-Level-3-Events/#event-type-keypress )
Por fim, para responder à sua pergunta, você deve usar
keyup
oukeydown
detectar um backspace no Firefox e Chrome.Experimente aqui:
fonte
Algo que escrevi no caso de alguém se deparar com um problema com pessoas atingindo o backspace enquanto pensam que estão em um campo de formulário
fonte
Meu controle numérico:
tente
O código da tecla BackSpace é 8
fonte
event.key === "Backspace"
Mais recente e muito mais limpo: use
event.key
. Chega de códigos numéricos arbitrários!Documentos do Mozilla
Navegadores suportados
fonte
.key
atualmente é a opção recomendada pelos documentos. Além disso, ele suporta vários teclados internacionais com mapeamentos diferentes para qualquer tecla. Eles não são arbitrárias no sentido de que eles são fixos, mas são ao ler códigoUse um dos eventos keyup / keydown / beforeinput.
com base nessa referência, o pressionamento de tecla é preterido e não é mais recomendado.
se você usar "beforeinput", tenha cuidado com a compatibilidade do navegador . a diferença entre "beforeinput" e os outros dois é que "beforeinput" é acionado quando o valor de entrada está prestes a mudar, portanto, com caracteres que não podem alterar o valor de entrada, ele não é acionado (por exemplo, shift, ctr, alt).
Eu tive o mesmo problema e, usando o keyup, foi resolvido.
fonte