KeyboardEvent Value (keyCodes, metaKey, etc) - CSS-tricks

När ett KeyboardEventavfyrar kan du testa vilken knapp som trycktes ned eftersom den händelsen innehåller information som du kan skriva logik mot.

document.addEventListener("keydown", function(event) ( console.log(event.which); ))

Till exempel, genom att trycka på “a” får du 65. Tydligen är det bäst att skriva logik mot vilken keyCode och charCode är komplicerade:

Event.which egenskapen normaliserar event.keyCode och event.charCode. Det rekommenderas att du tittar på event.which för tangentbordsinmatning.

Och:

I en tangenttryckningshändelse lagras Unicode-värdet för den nedtryckta tangenten i antingen keyCode- eller charCode-egenskapen, aldrig båda. Om tangenten som trycks ned genererar ett tecken (t.ex. 'a'), ställs charCode till koden för det tecknet, med hänsyn till bokstäverna. (dvs charCode tar hänsyn till om shift-tangenten hålls nere). Annars lagras koden för den tryckta knappen i keyCode.

Testverktyg

Se Pen event.keyCode-testaren av Chris Coyier (@chriscoyier) på CodePen.

Nyckelkodvärden

Här är en tabell som innehåller värdena från event.which.

Nyckel	Koda
bakre utrymme	8
flik	9
stiga på	13
flytta	16
ctrl	17
alt	18
pausa / pausa	19
Caps Lock	20
fly	27
(Plats)	32
sida upp	33
sida ned	34
slutet	35
Hem	36
vänster pil	37
uppåtpil	38
höger pil	39
nedåtpil	40
Föra in	45
radera	46
0	48
1	49
2	50
3	51
4	52
5	53
6	54
7	55
8	56
9	57
a	65
b	66
c	67
d	68

Nyckel	Koda
e	69
f	70
g	71
h	72
i	73
j	74
k	75
l	76
m	77
n	78
o	79
sid	80
q	81
r	82
s	83
t	84
u	85
v	86
w	87
x	88
y	89
z	90
vänster fönsterknapp	91
höger fönstertangent	92
välj-tangent	93
numpad 0	96
numpad 1	97
numpad 2	98
numpad 3	99
numpad 4	100
numpad 5	101
numpad 6	102
numpad 7	103

Nyckel	Koda
numpad 8	104
numpad 9	105
multiplicera	106
Lägg till	107
subtrahera	109
decimalpunkt	110
dela upp	111
f1	112
f2	113
f3	114
f4	115
f5	116
f6	117
f7	118
f8	119
f9	120
f10	121
f11	122
f12	123
Num lock	144
rullningslås	145
semikolon	186
likhetstecken	187
kommatecken	188
rusa	189
period	190
snedstreck	191
grov dialekt	192
öppet fäste	219
rygg snedstreck	220
stäng braket	221
enda offert	222

Zell Liew märkte att tre av dessa nyckelkoder var annorlunda i Firefox än resten av webbläsarna

; är 59 i Firefox men 186 i andra webbläsare.
= är 61 i Firefox men 187 i andra webbläsare.
- är 173 i Firefox men 189 i andra webbläsare.

Viktig anmärkning: Dessa nyckelkodvärden är endast giltiga under in keydownoch keyuphändelser. På Mac ger keypresshändelser dig en helt annan uppsättning koder.

Till exempel: