Håndtering af tastetryk i JavaScript

Ved hjælp af objektet Event kan man håndtere tastetryk. Lad os se, hvordan det gøres. Lad os sige, at vi har et inputfelt:

<input>

Lad os få en reference til det i en variabel:

let elem = document.querySelector('input');

Lad os tilføje en event til vores inputfelt, der udløses ved hvert tastetryk:

elem.addEventListener('keypress', function(event) {
	
});

I egenskaben key i event-objektet vil det trykkede tegn være:

elem.addEventListener('keypress', function(event) {
	console.log(event.key);
});

Og i egenskaben code vil koden for den trykte tast være:

elem.addEventListener('keypress', function(event) {
	console.log(event.code);
});

Lav et inputfelt, som ved indtastning vil udskrive værdierne af de indtastede taster og deres koder.

Tryk på forskellige taster i inputfeltet og se, hvilke værdier og koder de har.

Find ud af, hvilken kode tasten Enter har.

Find ud af, hvilken kode tasten BackSpace har.

Der er givet et afsnit og et inputfelt. Der indtastes tekst i det og der trykkes på tasten Enter. Gør så den indtastede tekst kommer i afsnittet under inputfeltet, og indholdet af inputfeltet ryddes.