Obtendo teclas pressionadas em JavaScript
Usando o objeto Event, podemos
obter as teclas pressionadas. Vamos
ver como isso é feito.
Suponha que temos um input:
<input>
Vamos obter uma referência para ele em uma variável:
let elem = document.querySelector('input');
Vamos adicionar um evento ao nosso input, que é acionado a cada pressionamento de tecla:
elem.addEventListener('keypress', function(event) {
});
Na propriedade key do objeto
de evento estará o
caractere pressionado:
elem.addEventListener('keypress', function(event) {
console.log(event.key);
});
E na propriedade code estará
o código da tecla pressionada:
elem.addEventListener('keypress', function(event) {
console.log(event.code);
});
Crie um input que, ao receber entrada, exiba os valores das teclas inseridas e seus códigos.
Pressione várias teclas no input e observe quais são seus valores e códigos.
Determine qual código a
tecla Enter terá.
Determine qual código a
tecla BackSpace terá.
Dado um parágrafo e um input. Um texto é digitado
nele e a tecla Enter é pressionada. Faça com
que, nesse momento, o texto digitado
apareça no parágrafo abaixo do input,
e o conteúdo do input seja limpo.