Como capturar um evento Backspace no KeyDown?

Ao criar uma página da Web ou um site fácil de usar, pode haver um requisito para abster o usuário de pressionar uma tecla específica enquanto preenche um formulário ou um questionário. Por exemplo, restringir o usuário a editar ou desfazer os dados já inseridos. Em tais cenários, capturar um backspace em um evento KeyDown é útil no final do desenvolvedor.

Este artigo elaborará as abordagens para capturar um backspace no evento KeyDown em JavaScript.

Como capturar um backspace no evento KeyDown em um elemento específico?

O "addEventListener ()”O método associa um evento a um elemento, e a propriedade Keycode refere -se a um código que significa um KeyPress. Essas abordagens podem ser utilizadas para anexar um evento ao campo de entrada buscado e notificar o usuário assim que a tecla específica for pressionada nele (campo de entrada).

Sintaxe

elemento.addEventListener (evento, função, userCapture);

Na sintaxe acima:

• • ““evento”Corresponde ao evento que precisa ser anexado.
  • ““função”O parâmetro corresponde à função que precisa ser executada quando o evento é acionado.
  • ““UserCapture”É um parâmetro opcional.

Exemplo

Vamos passar pelo snippet de código abaixo:

Detecte a chave do backspace

No bloco de código acima:

• • Primeiro de tudo, inclua um título no “

    " marcação.

  • Na próxima etapa, aloque um “entrada texto”Campo com o declarado“eu ia”.
  • No código JavaScript, acesse o campo de texto de entrada criado por seu “eu ia”Usando o“getElementById ()”Método.
  • Depois disso, associe o “addEventListener ()”Método com o elemento buscado (campo de entrada). Nos parâmetros do método, o antigo parâmetro, eu.e., ““keydown”Significa o nome do evento, e o último parâmetro refere -se à função que precisa ser invocada no evento acionado.
  • Na definição da função, aplique o “Código chave”Propriedade com o código declarado referente ao“Backspace"Chave na"se" doença.
  • Após a condição satisfeita, o alerta com a mensagem declarada será exibida no Modelo de Objeto do Documento (DOM).

Saída

Na saída, pode -se observar que, ao pressionar a tecla Backspace, o usuário é notificado com a mensagem declarada por meio de um alerta.

Como capturar um backspace no evento KeyDown em qualquer lugar de todo o Modelo de Objeto do Documento (DOM)?

Neste exemplo em particular, um backspace será capturado com a ajuda do código -chave especificado na forma de um “caso”Dentro da função que precisa ser executada no evento acionado:

Detecte a chave do backspace

Nas linhas acima do código:

• • Da mesma forma, inclui o cabeçalho declarado no “

    " marcação.

  • Na parte JavaScript do Código, da mesma forma, aplique o “addEventListener ()”Método com o evento anexado chamado“keydown”E o nome da função como seus parâmetros, respectivamente.
  • Depois disso, defina uma função chamada “keycheck ()”Tendo o parâmetro declarado.
  • Em sua definição, associe o “Código chave”Propriedade com o parâmetro aprovado para que o código -chave correspondente contra a chave seja detectado no evento acionado.
  • Por fim, aplique o “interruptor/caixa”Declaração de que o código de chave específico contra a chave do backspace é invocado do“caso”Declaração, e a mensagem correspondente será exibida através do alerta.

Saída

Nesta saída, pode -se observar que o requisito desejado foi alcançado.

Conclusão

Para capturar um backspace no “keydownEvento em JS, use a combinação do “addEventListener ()”Método e o“Código chave" propriedade. O exemplo anterior usa essas abordagens para capturar a chave específica em um elemento específico. O último exemplo pode ser utilizado para detectar a chave do backspace em todo o DOM. Este blog discutiu as abordagens para capturar backspace no evento KeyDown em JavaScript.