Billentyűkód-kereső
Nyomj meg egy billentyűt, és megkapod a JavaScript event.key, event.code, keyCode, which és location értékét, előzményekkel és teljes billentyűkód-táblával.
Kattints a „Billentyűk rögzítésének indítása” gombra vagy az alábbi mezőre, majd nyomj meg egy billentyűt. Ha a mezőn kívülre kattintasz, a billentyűzet visszakerül az oldalhoz.
- event.key
- –
- event.code
- –
- event.keyCode
- –
- event.which
- –
- event.location
- –
- event.repeat
- –
- Bekapcsolt zárbillentyűk
- –
| Esemény | key | code | keyCode | location | Módosítók | repeat |
|---|
| key | code | keyCode | location | Megjegyzés |
|---|
A key értékek módosítók nélküli, amerikai kiosztásra vonatkoznak; más kiosztások ugyanahhoz a code értékhez más karaktereket adnak. A keyCode és a which elavult, de még mindig széles körben használt.
Hogyan találd meg egy billentyű kódját
- Kattints a Billentyűk rögzítésének indítása gombra, vagy a nagy mezőre. A színes keret jelzi, hogy az eszköz figyel.
- Nyomj meg egy billentyűt vagy billentyűkombinációt. A nagy kijelzőn a
keyérték és a régikeyCodejelenik meg, az alatta lévő kártyákon pedig azevent.key,event.code,event.keyCode,event.which,event.location,event.repeatés a Bekapcsolt zárbillentyűk (Caps Lock, Num Lock, AltGraph). - A Módosítók jelölői kigyulladnak a
ctrlKey,shiftKey,altKeyésmetaKeyértékeknek megfelelően. - Másold ki a JavaScript-kódrészletet ehhez a billentyűhöz. Az Egyeztetés ez alapján beállítással választhatsz az
event.key, azevent.codeés azevent.keyCode (legacy)között. - Görgesd a Billentyűelőzményeket (legutóbbi elöl), hogy több leütést összehasonlíts. Jelöld be A keyup eseményeket is naplózza opciót, ha a felengedéseket is látni szeretnéd.
- Böngészd vagy szűrd a Billentyűkód-referencia (US QWERTY) táblát, ha egy értékre van szükséged anélkül, hogy megnyomnád a billentyűt.
Amíg a mezőn van a fókusz, minden billentyű alapértelmezett művelete le van tiltva, így a Tab, a nyílbillentyűk, a Backspace vagy a Ctrl+S rögzítésre kerül ahelyett, hogy elmozdítaná a fókuszt vagy megnyitna egy párbeszédablakot. Kattints bárhová a mezőn kívül, hogy a billentyűzet visszakerüljön az oldalhoz. Néhány billentyűkombinációt az operációs rendszer kezel le, mielőtt a böngésző látná őket (Alt+Tab, Ctrl+Alt+Del, Cmd+Tab, gyakran a Print Screen), ezért ezeket egyetlen weboldal sem tudja kiolvasni.
key, code vagy keyCode: melyiket használd?
Egy KeyboardEvent több értéket hordoz, amelyek különböző kérdésekre válaszolnak:
| Tulajdonság | Mit mutat | Példa (a Z billentyű magyar QWERTZ kiosztáson) |
|---|---|---|
key |
A kiosztás és a módosítók után keletkező karakter vagy elnevezett billentyű | "z", Shifttel "Z" |
code |
A billentyű fizikai helye, a kiosztástól függetlenül | "KeyY" |
keyCode / which |
Régi szám, általában a betű nagybetűs ASCII-kódja | 90 |
location |
0 szokásos, 1 bal, 2 jobb, 3 számbillentyűzet | 0 |
Használd a key értéket, ha a jelentés számít: Enter a küldéshez, Escape a bezáráshoz, „?” a súgópanel megnyitásához. A code értéket olyan játékokhoz és billentyűparancsokhoz használd, amelyek a billentyűk helyétől függnek, például a WASD-mozgáshoz, amelynek a magyar QWERTZ és a francia AZERTY billentyűzeten is ugyanott kell maradnia. Az új kódban kerüld a keyCode és a which használatát: elavultak, az írásjelek értékei böngészőnként eltérnek (a Firefox a pontosvesszőre 59-et küld, a Chrome 186-ot), és nem tudják megkülönböztetni a bal és a jobb Shiftet, sem a két Entert. Régebbi kód karbantartásakor mégis érdemes ismerni őket, ezért mutatja őket az eszköz.
A kódrészletről
A generált eseményfigyelő pontosan a megnyomott billentyűre illeszkedik, a Ctrl, az Alt és a Meta állapotával együtt. A key alapján illesztett nyomtatható karaktereknél a Shift kimarad, mert már benne van az értékben: a Shift+1 amerikai kiosztáson "!" karaktert ad. Ha egy módosítót önmagában nyomsz meg, a kódrészlet nem ismétli meg a saját jelzőjét. Ne feledd, hogy a metaKey Macen a Cmd billentyű, PC-n a Windows-billentyű, ezért a platformfüggetlen billentyűparancsok általában az event.ctrlKey || event.metaKey feltételt vizsgálják.
Gyakori kérdések
Miért mutat a keyCode ugyanazt a számot különböző karakterekre?
A keyCode a billentyűt azonosítja, nem a karaktert. Az 1-es számjegy és a „!” közös 49-es értéken osztozik, az „a” és az „A” pedig a 65-ösön. A valódi karakterhez a key értéket olvasd.
Miért jelenik meg a magyar billentyűzetem Z billentyűje KeyY-ként?
A code a billentyűket az amerikai QWERTY billentyűzeten elfoglalt helyükről nevezi el. A magyar billentyűzeten Z feliratú billentyű ott van, ahol az amerikain az Y, ezért a code értéke KeyY, a key értéke viszont „z”.
Mit jelent a „Dead” az event.key értékében?
Ez egy holtbillentyű, például a magyar kiosztáson az AltGr-rel elérhető ˇ vagy ¨, amely a következő billentyűre vár, hogy ékezetes betűt hozzon létre. A végleges karaktert a következő billentyűesemény vagy a szövegmező input eseménye adja.
Miért igen az event.repeat értéke?
Nyomva tartod a billentyűt, és az operációs rendszer automatikus ismétléseket küld. Az event.repeat ellenőrzésével kiszűrheted őket, például ha egy billentyűparancsot csak egyszer szeretnél lefuttatni.
Rögzít vagy küld el bármit abból, amit beírok?
Nem. A billentyűeseményeket ez az oldal olvassa a böngésződben, és soha nem küldi el őket sehová. Az előzmények az oldal újratöltésekor vagy elhagyásakor eltűnnek.
Kapcsolódó eszközök
- Billentyűzet teszt Ingyenes online billentyűzet teszt: kivilágítja a lenyomott billentyűket, mutatja a key, code, location értékeket, méri az N-key rollovert és a beragadást.
- Regex-teszter Tesztelj JavaScript reguláris kifejezéseket élőben: kiemelt találatok, rögzítő csoportok, csere és minden elem magyarázata közérthető nyelven.
- JavaScript AST felfedező Illeszd be a JavaScript-kódot, és böngészd az absztrakt szintaxisfáját (ESTree, Acorn) a böngésződben. Kattints a csomópontokra, exportáld JSON-ként.