JavaScript KeyCode Finder & Event Referentie
Vind onmiddellijk de numerieke keyCode, key en code waarden voor elke toetsaanslag. Onze interactieve JS KeyCode tool helpt ontwikkelaars gebruikersinvoer vast te leggen, sneltoetsen te maken en gamebesturingen nauwkeurig te beheren. Druk op een toets om de evenementgegevens in realtime te zien.
Bij webontwikkeling is het omgaan met toetsenbordgebeurtenissen essentieel voor toegankelijkheid en UX. Deze tool levert de drie kritieke waarden voor addEventListener:
- event.key: Het daadwerkelijke teken dat wordt geproduceerd (bijv.
"a", "Enter", "ArrowUp").
- event.code: De fysieke toets op het toetsenbord (bijv.
"KeyA", "NumpadEnter").
- event.keyCode (Legacy): De numerieke code die aan de toets is gekoppeld (bijv.
13 voor Enter, 27 voor Escape).
Moderne vs legacy key events
Hoewel veel oudere tutorials event.keyCode gebruiken, is de moderne webstandaard verschoven naar event.key en event.code voor betere browser- en internationale ondersteuning.
- Verouderd:
keyCode, which, charCode.
- Modern standaard:
key (op waarde) en code (op positie).
Veelgebruikte JavaScript KeyCodes
| Toets |
keyCode |
.key Waarde |
.code Waarde |
| Enter |
13 |
"Enter" |
"Enter" |
| Escape |
27 |
"Escape" |
"Escape" |
| Space |
32 |
" " |
"Space" |
| Arrow Up |
38 |
"ArrowUp" |
"ArrowUp" |
| Tab |
9 |
"Tab" |
"Tab" |
Hoe KeyCode Finder te gebruiken
- Focus: Klik in het invoerveld om het actief te maken.
- Druk: Druk op een toets.
- Inspecteer: Het scherm wordt onmiddellijk bijgewerkt met de numerieke code en stringwaarden voor dat evenement.
- Implementeer: Kopieer de waarden direct in je
if of switch.
Opmerking voor ontwikkelaars: Alle events worden lokaal in de browser gedetecteerd via een keydown listener. Geen gegevens worden naar onze servers gestuurd.