In this blog, we will know how to check if the shift key is pressed in Javascript?
We have many methods to check but we know the easiest methods.
Method 1: Using shiftKey
The KeyboardEvent.shiftKey read-only property is a boolean value that indicates if the shift key was pressed ( true ) or not ( false )
Html
<!DOCTYPE html>
<html>
<head>
<title>Check if the shift key is pressed</title>
</head>
<body>
<textarea onkeydown="isKeyPressed(event)"></textarea>
</body>
</html>
Javascript
function isKeyPressed(event) {
var x = document.getElementById("demo");
if (event.shiftKey) {
alert("The SHIFT key was pressed!");
}
}
Method 2: using keyCode
This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.
HTML
<!DOCTYPE html>
<html>
<head>
<title>Check if the shift key is pressed</title>
</head>
<body>
<textarea onkeydown="isKeyPressed(event)"></textarea>
</body>
</html>
Javascript
var isKeyPressed = function (ev) {
if(ev.keyCode == 16){
alert('shift key pressed');
}
}
Here is the key code for each keystroke in JavaScript. You can use that and detect if the user has pressed the key.
backspace 8
tab 9
enter 13
shift 16
ctrl 17
alt 18
pause/break 19
caps lock 20
escape 27
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
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
left window key 91
right window key 92
select key 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
numpad 8 104
numpad 9 105
multiply 106
add 107
subtract 109
decimal point 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
num lock 144
scroll lock 145
semi-colon 186
equal sign 187
comma 188
dash 189
period 190
forward slash 191
grave accent 192
open bracket 219
back slash 220
close braket 221
single quote 222
Hope this post will help you.

Brijpal Sharma is a web developer with a passion for writing tech tutorials. Learn JavaScript and other web development technology.