Utilia

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 Nyomj meg egy billentyűt keyCode – A Tab, a nyilak és a billentyűkombinációk is itt kerülnek rögzítésre.
event.key
–
event.code
–
event.keyCode
–
event.which
–
event.location
–
event.repeat
–
Bekapcsolt zárbillentyűk
–
Módosítók
ctrlKey shiftKey altKey metaKey
Billentyűelőzmények (legutóbbi elöl)
Billentyűelőzmények (legutóbbi elöl)
EseménykeycodekeyCodelocationMódosítókrepeat
Billentyűkód-referencia (US QWERTY)

Billentyűkód-referencia (US QWERTY)
keycodekeyCodelocationMegjegyzé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

  1. 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.
  2. Nyomj meg egy billentyűt vagy billentyűkombinációt. A nagy kijelzőn a key érték és a régi keyCode jelenik meg, az alatta lévő kártyákon pedig az event.key, event.code, event.keyCode, event.which, event.location, event.repeat és a Bekapcsolt zárbillentyűk (Caps Lock, Num Lock, AltGraph).
  3. A Módosítók jelölői kigyulladnak a ctrlKey, shiftKey, altKey és metaKey értékeknek megfelelően.
  4. 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, az event.code és az event.keyCode (legacy) között.
  5. 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.
  6. 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.