More

자바스크립트 키입력 event keycode표와 사용법

자바스크립트를 이용해 키입력을 받아 처리해야 할 때 사용하는 키코드 목록입니다. 주로 keydown을 사용 할 때 나오는 이벤트를 처리할 때 사용합니다. toptal.com 페이지에서 하나씩 눌러가며 확인해도 되지만 한번에 쉽게 확인하기 위해 테이블로 만들어 봤습니다.

toptal-키코드테스트

toptal.com 자바스크립트 키코드 테스트 페이지

👉 자바스크립트 키코드 테스트 사이트



키코드 사용법

아래 처럼 keydown이나 keyup 이벤트를 통해 keycode를 받아 해당키에 맞는 이벤트를 넣어줄 수 있습니다. 저는 주로 키 입력을 체크하여 화면상에서 누를 수 있는 단축키를 만들 때 사용했는데 input 란에 내용을 입력하고 enter 를 체크하여 form 입력을 넘기는 방법을 사용할 수 도 있습니다.

jsfiddle-테스트

저는 주로 키 입력을 받아 번호를 체크하고 화면에서 누르는 단축키를 만드는데 사용합니다
그림상에선 shift 키를 눌러 16번 이란 내용을 alert 으로 보여주고 있습니다.



javascript KeyCode table

KEY

KeyCode

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

E

69

F

70

G

71

H

72

I

73

J

74

K

75

L

76

M

77

N

78

O

79

P

80

Q

81

R

82

S

83

T

84

U

85

V

86

W

87

X

88

Y

89

Z

90

a

65

b

66

c

67

d

68

e

69

f

70

g

71

h

72

i

73

j

74

k

75

l

76

m

77

n

78

o

79

p

80

q

81

r

82

s

83

t

84

u

85

v

86

w

87

x

88

y

89

z

90

Numpad 0

96

Numpad 1

97

Numpad 2

98

Numpad 3

99

Numpad 4

100

Numpad 5

101

Numpad 6

102

Numpad 7

103

Numpad 8

104

Numpad 9

105

Multiply

106

Add

107

Enter

13

Subtract

109

Decimal

110

Divide

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

Backspace

8

Tab

9

Enter

13

Shift

16

Left Control

17

Right Control

25

Left Alt

18

Right Alt

21

Caps Lock

20

Esc

27

Spacebar

32

Page Up

33

Page Down

34

End

35

Home

36

Left Arrow

37

Up Arrow

38

Right Arrow

39

Down Arrow

40

Insert

45

Delete

46

Num Lock

144

ScrLk

145

Pause/Break

19

; :

186

= +

187

? _

189

/?

191

~

192

[ {

219

\ |

220

] }

221

” ‘

222

< ,

188

> .

190