Λήψη Πιεσμένων Πλήκτρων στο JavaScript

Χρησιμοποιώντας το αντικείμενο Event μπορούμε να λαμβάνουμε πιεσμένα πλήκτρα. Ας δούμε πώς γίνεται αυτό. Ας υποθέσουμε ότι έχουμε ένα πεδίο εισαγωγής:

<input>

Ας πάρουμε μια αναφορά σε αυτό σε μια μεταβλητή:

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

Ας προσθέσουμε ένα event listener στο πεδίο εισαγωγής μας, που ενεργοποιείται με κάθε πίεση πλήκτρου:

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

Στην ιδιότητα key του αντικειμένου του συμβάντος θα βρίσκεται ο πιεσμένος χαρακτήρας:

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

Και στην ιδιότητα code θα βρίσκεται ο κωδικός του πιεσμένου πλήκτρου:

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

Δημιουργήστε ένα πεδίο εισαγωγής που κατά την πληκτρολόγηση θα εκτυπώνει τις τιμές των πληκτρολογημένων πλήκτρων και τους κωδικούς τους.

Πατήστε διάφορα πλήκτρα στο πεδίο εισαγωγής και δείτε ποιες είναι οι τιμές και οι κωδικοί τους.

Προσδιορίστε ποιος κωδικός θα έχει το πλήκτρο Enter.

Προσδιορίστε ποιος κωδικός θα έχει το πλήκτρο BackSpace.

Δίνεται μια παράγραφος και ένα πεδίο εισαγωγής. Πληκτρολογείται κείμενο σε αυτό και πατιέται το πλήκτρο Enter. Κάντε έτσι ώστε αυτή τη στιγμή το πληκτρολογημένο κείμενο να εμφανίζεται στην παράγραφο κάτω από το πεδίο εισαγωγής, και το περιεχόμενο του πεδίου εισαγωγής να καθαρίζεται.