Utilia
Kategorier ▾
Språk: sv ▾

Keycode-sökare för JavaScript

Tryck på valfri tangent och se värdena för event.key, event.code, keyCode, which och location i JavaScript, med modifierare, historik och full tabell.

Klicka på ”Börja fånga tangenter” eller på rutan nedan och tryck sedan på valfri tangent. Klicka utanför rutan för att lämna tillbaka tangentbordet till sidan.

event.key Tryck på en tangent keyCode – Tabb, piltangenter och kortkommandon fångas också här.
event.key
–
event.code
–
event.keyCode
–
event.which
–
event.location
–
event.repeat
–
Aktiva låstangenter
–
Modifierare
ctrlKey shiftKey altKey metaKey
Tangenthistorik (senaste först)
Tangenthistorik (senaste först)
HändelsekeycodekeyCodelocationModifierarerepeat
Referens över tangentkoder (amerikansk QWERTY)

Referens över tangentkoder (amerikansk QWERTY)
keycodekeyCodelocationAnmärkning

key-värdena gäller en amerikansk layout utan modifierare; andra layouter ger andra tecken för samma code. keyCode och which är föråldrade men används fortfarande flitigt.

Så hittar du en tangentkod

  1. Klicka på Börja fånga tangenter eller på den stora rutan. En färgad ram visar att den lyssnar.
  2. Tryck på valfri tangent eller ett kortkommando. Den stora displayen visar värdet key och den äldre keyCode, och korten nedanför listar event.key, event.code, event.keyCode, event.which, event.location, event.repeat och Aktiva låstangenter (Caps Lock, Num Lock, AltGraph).
  3. Märkena under Modifierare tänds för ctrlKey, shiftKey, altKey och metaKey.
  4. Kopiera JavaScript-kodsnutt för den här tangenten. Med Matcha på väljer du mellan event.key, event.code och event.keyCode (föråldrad).
  5. Bläddra i Tangenthistorik (senaste först) för att jämföra flera tryck. Kryssa i Logga även keyup-händelser om du också vill se när tangenterna släpps.
  6. Bläddra i eller filtrera tabellen Referens över tangentkoder (amerikansk QWERTY) när du behöver ett värde utan att trycka på tangenten.

Medan rutan har fokus blockeras standardåtgärden för varje tangent, så att Tabb, piltangenterna, Backsteg eller Ctrl+S fångas i stället för att flytta fokus eller öppna en dialogruta. Klicka var som helst utanför rutan för att lämna tillbaka tangentbordet till sidan. Några kortkommandon hanteras av operativsystemet innan webbläsaren ser dem (Alt+Tabb, Ctrl+Alt+Del, Cmd+Tabb, ofta Print Screen), så ingen webbsida kan läsa dem.

key, code eller keyCode: vilken ska du använda?

En KeyboardEvent innehåller flera värden som svarar på olika frågor:

Egenskap Vad den berättar Exempel (A-tangenten på franskt AZERTY)
key Tecknet eller den namngivna tangent som skapas, efter layout och modifierare "a", "A" med Skift
code Tangentens fysiska position, oberoende av layout "KeyQ"
keyCode / which Ett äldre nummer, oftast ASCII-koden för versalen 65
location 0 standard, 1 vänster, 2 höger, 3 numeriskt tangentbord 0

Använd key när betydelsen är viktig: Enter för att skicka, Escape för att stänga, ”?” för att öppna en hjälppanel. Använd code för spel och kortkommandon som beror på var tangenterna sitter, till exempel WASD-styrning, som ska ligga på samma ställe på ett franskt AZERTY- eller ett tyskt QWERTZ-tangentbord. På ett svenskt tangentbord sitter Ö där semikolon finns på ett amerikanskt, så den tangenten har code "Semicolon" men key "ö". Undvik keyCode och which i ny kod: de är föråldrade, deras värden för skiljetecken varierar mellan webbläsare (Firefox skickar 59 för semikolon där Chrome skickar 186) och de kan inte skilja vänster och höger Skift, eller de två Enter-tangenterna, från varandra. De är ändå bra att känna till när du underhåller äldre kod, och därför visar verktyget dem.

Om kodsnutten

Den genererade lyssnaren matchar exakt den tangent du tryckte på, inklusive Ctrl, Alt och Meta. För skrivbara tecken som matchas på key utelämnas Skift, eftersom den redan ingår i värdet: Skift+1 ger "!" på en amerikansk layout. Trycker du på en modifierare ensam upprepar kodsnutten inte dess flagga. Kom ihåg att metaKey är Cmd-tangenten på en Mac och Windows-tangenten på en pc, så kortkommandon för flera plattformar testar oftast event.ctrlKey || event.metaKey.

Vanliga frågor

Varför visar keyCode samma nummer för olika tecken?

keyCode identifierar tangenten, inte tecknet. Siffran 1 och ”!” delar på 49, och ”a” och ”A” delar på 65. Läs key för att få det verkliga tecknet.

Varför visas min Ö-tangent som Semicolon?

code namnger tangenterna efter deras position på ett amerikanskt QWERTY-tangentbord. Tangenten märkt Ö på ett svenskt tangentbord sitter där semikolon finns på ett amerikanskt, så dess code är Semicolon medan dess key är ”ö”. På samma sätt får A-tangenten på ett franskt AZERTY-tangentbord koden KeyQ.

Vad betyder ”Dead” i event.key?

Det är en död tangent, som ¨ eller ´ på ett svenskt tangentbord, som väntar på nästa tangent för att bilda en bokstav med accent. Det slutliga tecknet levereras av nästa tangenthändelse eller av textfältets input-händelse.

Varför står det ja vid event.repeat?

Du håller ner tangenten och operativsystemet skickar automatiska upprepningar. Kontrollera event.repeat för att ignorera dem, till exempel för att ett kortkommando bara ska utlösas en gång.

Registreras eller skickas något jag skriver?

Nej. Tangenthändelserna läses av den här sidan i din webbläsare och skickas aldrig någonstans. Historiken försvinner när du laddar om eller lämnar sidan.

Relaterade verktyg