key
, keyCode
and which
can be used to determine which key is pressed. Following is a sample code that handles the keyPress
event of a text box.
It checks if user presses the Enter key whose key code is 13:
textBoxElement.addEventListener('keydown', function (e) {
if (e.keyCode === 13) {
}
});
Difference
According to MDN documentations, both
keyCode and
which are deprecated and will be removed from the Web standards.
Apart from that, both properties are supported differently by browsers. Some browsers use keyCode
, other use which
.
It's common to see how they are normalized as following:
const key = 'which' in e ? e.which : e.keyCode;
const key = e.which || e.keyCode || 0;
Good practice
It's recommended to use the
key property.
The sample code above can be rewritten as
if (e.key === 'Enter') {
}