JavaScript KeyCode opzoeken
Druk op een toets om de waarden keyCode, key, code en which te zien
Toetsenbordregistratie
Klik hier en druk op een toets
Toetsenbordgebeurtenissen worden alleen in dit gebied vastgelegd. Tab legt de toets vast en verplaatst de focus naar het volgende bedieningselement.
Gebruik een fysiek toetsenbord voor volledige toetsenbordgebeurtenissen. Schermtoetsenborden laten soms eigenschappen weg.
Laatste toetsaanslagen
Uw laatste 10 toetsaanslagen verschijnen hier.
Details van toetsenbordgebeurtenis
event.keyevent.codeevent.keyCodeVerouderdevent.whichVerouderdevent.locationevent.repeatModifier-toetsen
Plaats de focus op het registratiegebied om een toetsenbordgebeurtenis te bekijken.
Over JavaScript KeyCode opzoeken
De JavaScript KeyCode opzoeken-tool is een gratis, interactief hulpmiddel voor ontwikkelaars dat direct alle eigenschappen van een toetsenbordgebeurtenis toont wanneer u een toets indrukt. Of u nu sneltoetsen, spelbesturing of toegankelijke navigatie bouwt, de exacte waarden van event.key, event.code, event.keyCode en event.which zijn onmisbaar voor betrouwbaar JavaScript dat in elke browser werkt.
Moderne webapplicaties zijn sterk afhankelijk van verwerking van toetsenbordgebeurtenissen, van formuliervalidatie tot samenwerkingstools in realtime. Dit hulpmiddel haalt het giswerk weg: het toont de fysieke toetscode, de logische toetswaarde, de locatie-aanduiding en alle modifier-statussen (Shift, Ctrl, Alt, Meta) op het moment dat een toets wordt ingedrukt, direct in uw browser en zonder enige installatie.
In tegenstelling tot statische keycode-overzichten registreert deze live JavaScript-tester voor toetsgebeurtenissen echte browsergebeurtenissen, zodat u het gedrag kunt controleren op verschillende besturingssystemen en toetsenbordindelingen. De tool geeft ook duidelijk aan welke eigenschappen verouderd zijn, zodat u toekomstbestendige code schrijft die de huidige W3C Keyboard Event-standaarden volgt.
Belangrijkste functies
- Realtime weergave van
event.key,event.code,event.keyCode,event.whichenevent.location - Visuele indicatoren voor modifiertoetsen met de status van Shift, Ctrl, Alt en Meta
- Badges voor verouderde eigenschappen zoals keyCode en which
- Met één klik de waarde van elke afzonderlijke gebeurtenis-eigenschap kopiëren
- Alle toetsgegevens exporteren als opgemaakt JSON-object
- Geschiedenistabel met uw laatste 10 toetsaanslagen om te vergelijken
- Onderscheidt automatisch de linker-, rechter- en numpad-locaties van toetsen
- Visuele weergave van de toets voor eenvoudige herkenning
- Werkt met elke toets, ook functietoetsen, pijltjestoetsen en speciale tekens
- Volledig responsief ontwerp met ondersteuning voor donkere modus
JavaScript KeyCode opzoeken gebruiken
- Activeer het invoergebied: Klik ergens in de gestippelde toetsenzone bovenaan de tool om het luisteren naar het toetsenbord te starten.
- Druk op een toets: Druk op een willekeurige toets en alle eigenschappen van de gebeurtenis verschijnen direct in het eigenschappenraster hieronder.
- Controleer de modifierstatus: Bekijk de indicatoren voor Shift, Ctrl, Alt en Meta om te zien welke modifiers actief waren tijdens de toetsaanslag.
- Waarden kopiëren: Klik op het kopieerpictogram naast een eigenschap om de waarde te kopiëren, of gebruik de knop "Alles kopiëren als JSON" om alle eigenschappen in één keer te exporteren.
- Toetsen vergelijken: Druk achter elkaar op meerdere toetsen en scrol naar de geschiedenistabel om hun codes naast elkaar te vergelijken.
- Wissen en herhalen: Klik op de knop Wissen om alle gegevens te resetten en een nieuwe testsessie te starten.
Toepassingen
- Sneltoetsen ontwikkelen: Achterhaal de juiste key- en code-waarden om eigen sneltoetsen in webapplicaties te implementeren.
- Spelbesturing: Koppel fysieke toetsen aan spelacties door event.code te controleren voor toetsbindingen die niet van de indeling afhangen.
- Toegankelijkheid testen: Controleer of toetsenbordnavigatie correct werkt en alle interactieve elementen op de verwachte toetsen reageren.
- Verouderde code migreren: Zoek moderne event.key-equivalenten voor verouderde event.keyCode-waarden in oudere projecten.
- Debuggen in meerdere browsers: Controleer of toetsgebeurtenissen consistente waarden opleveren in Chrome, Firefox, Safari en Edge.
- Invoer in formulieren valideren: Bepaal de exacte toetswaarden om bepaalde tekens in tekstvelden toe te staan of te blokkeren.
- Tutorials en documentatie schrijven: Zoek snel nauwkeurige keycode-gegevens op voor ontwikkelaarshandleidingen en naslagmateriaal.
- Numpad en hoofdtoetsenbord onderscheiden: Gebruik de eigenschap location om het numpad te onderscheiden van de gewone cijfertoetsen.
Veelgestelde vragen
Wat is het verschil tussen event.key en event.code?
event.key geeft de logische waarde van de toets terug (bijvoorbeeld "a" of "A", afhankelijk van Shift), terwijl event.code de fysieke toets op het toetsenbord teruggeeft (bijvoorbeeld "KeyA"), ongeacht modifiers of toetsenbordindeling. Gebruik event.key voor tekstinvoer en event.code voor sneltoetsen die op positie zijn gebaseerd.
Is event.keyCode nog veilig te gebruiken?
event.keyCode is door het W3C officieel als verouderd aangemerkt en kan zich in verschillende browsers inconsistent gedragen. Gebruik voor nieuwe projecten event.key of event.code. Veel oudere codebases vertrouwen echter nog op keyCode, daarom toont deze tool het als referentie voor achterwaartse compatibiliteit.
Waarom is het veld location belangrijk?
De eigenschap event.location maakt onderscheid tussen toetsen die op een toetsenbord op meerdere plaatsen voorkomen, zoals linker Shift en rechter Shift, of de cijferrij en het numpad. Dit is cruciaal voor applicaties die dubbele toetsen uit elkaar moeten houden.
Is deze tool gratis?
Ja, JavaScript KeyCode opzoeken is volledig gratis te gebruiken, zonder aanmelding, zonder gebruikslimieten en zonder verborgen kosten. U kunt het zo vaak gebruiken als u nodig hebt voor ontwikkeling en tests.
Zijn mijn gegevens veilig?
Zeker. Alle toetsdetectie gebeurt volledig in uw browser met native JavaScript-toetsenbordgebeurtenissen. Er worden nooit toetsaanslagen of gebeurtenisgegevens naar een server gestuurd. Uw invoer blijft volledig privé op uw apparaat.
Werkt dit op mobiele apparaten?
De tool werkt het best met een fysiek toetsenbord. Op mobiele apparaten activeert het schermtoetsenbord niet alle gebeurtenis-eigenschappen consistent. Gebruik voor betrouwbare resultaten een desktop of laptop, of sluit een extern toetsenbord aan op uw mobiele apparaat.
Tips & best practices
- Geef de voorkeur aan event.key voor tekstinvoer: Het houdt automatisch rekening met toetsenbordindeling, taal en modifierstatus.
- Gebruik event.code voor spelbesturing: Fysieke toetsposities blijven gelijk, ongeacht de toetsenbordindeling van de gebruiker (QWERTY, AZERTY, Dvorak).
- Test altijd combinaties met modifiers: Druk op Ctrl+Shift+toets of Alt+toets om te controleren of uw sneltoetsluisteraars de juiste combinatie opvangen.
- Zoek patronen in de geschiedenistabel: Door meerdere toetsaanslagen te vergelijken ziet u sneller inconsistenties of vindt u de juiste codes.
- Exporteer JSON voor documentatie: Gebruik de functie "Alles kopiëren als JSON" om nauwkeurige toetsgegevens direct in opmerkingen in uw code of in ontwikkelaarsdocumentatie te plakken.
- Test in meerdere browsers: Waarden van toetsgebeurtenissen kunnen per browser verschillen, vooral bij speciale toetsen. Controleer altijd uw doelbrowsers.