Gedrückte Tasten in JavaScript abfangen

Mit dem Event-Objekt kann man gedrückte Tasten abfangen. Lasst uns ansehen, wie das gemacht wird. Nehmen wir an, wir haben ein Input-Feld:

<input>

Wir holen uns eine Referenz darauf in eine Variable:

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

Wir hängen ein Event an unser Input-Feld, das bei jedem Tastendruck ausgelöst wird:

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

In der Eigenschaft key des Event-Objekts befindet sich das gedrückte Zeichen:

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

Und in der Eigenschaft code befindet sich der Code der gedrückten Taste:

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

Erstellen Sie ein Input-Feld, das bei der Eingabe die Werte der eingegebenen Tasten und ihre Codes ausgibt.

Drücken Sie verschiedene Tasten in dem Input-Feld und schauen Sie, welche Werte und Codes sie haben.

Stellen Sie fest, welchen Code die Taste Enter hat.

Stellen Sie fest, welchen Code die Taste BackSpace hat.

Gegeben sind ein Absatz und ein Input-Feld. Es wird Text eingegeben und die Taste Enter gedrückt. Sorgen Sie dafür, dass der eingegebene Text in diesem Moment in den Absatz unter dem Input-Feld übernommen wird und der Inhalt des Input-Felds gelöscht wird.