Jason210 Jason210 - 1 month ago 6
Javascript Question

JavaScript keyCode deprecated. What does this mean in practice?

According to MDN, we should most definitely not be using the .keyCode property. It is deprecated:

https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode

On w3 schools, this fact is played down and there is only a side note saying that

.keyCode
is provided for compatibility only and that the latest version of the DOM Events Specification recommend using the
.key
property instead.

The problem is that
.key
is not supported by browsers, so what should we using? Is there something I'm missing?

Answer Source

You have three ways to handle it, as it's written on the link you shared.

if (event.key !== undefined) {
  
} else if (event.keyIdentifier !== undefined) {
  
} else if (event.keyCode !== undefined) {
  
}

you should contemplate them, that's the right way if you want cross browser support.

It could be easier if you implement something like this.

var dispatchForCode = function(event, callback) {
  var code;
  
  if (event.key !== undefined) {
    code = event.key;
  } else if (event.keyIdentifier !== undefined) {
    code = event.keyIdentifier;
  } else if (event.keyCode !== undefined) {
    code = event.keyCode;
  }
  
  callback(code);
};