Touche Num Lock en JavaScript

Pour Num Lock, event.key vaut NumLock, event.code vaut NumLock et la propriété obsolète keyCode vaut 144. Appuyez sur n'importe quelle touche dans le Key Code Finder pour voir ses valeurs en direct.

Mis à jour le

PropriétéValeur
event.keyNumLock
event.codeNumLock
event.keyCode / which (obsolète)144

Comment détecter Num Lock

document.addEventListener('keydown', (event) => {
  if (event.key === "NumLock") {
    // Num Lock was pressed
  }
});

Utilisez event.key pour réagir à la signification de la touche (elle suit la disposition du clavier) et event.code pour sa position physique, par exemple WASD dans les jeux. keyCode et which sont obsolètes : ils fonctionnent toujours, mais leurs valeurs varient selon les navigateurs et les dispositions.

Comment les navigateurs gèrent Num Lock

Avec Num Lock désactivé, le pavé numérique envoie des touches de navigation (Début, Fin, flèches) au lieu des chiffres. Vérifiez event.getModifierState("NumLock").

Avec React

<input onKeyDown={(e) => { if (e.key === "NumLock") { /* … */ } }} />

Questions fréquentes

Quel est le keyCode de Num Lock ?
144. Il est toutefois obsolète : utilisez event.key (« NumLock ») ou event.code (NumLock) dans le nouveau code.
Quelle est la différence entre event.key et event.code ?
event.key est le caractère ou l'action produit par la touche avec la disposition actuelle ; event.code est la position physique de la touche, identique sur toutes les dispositions.
Faut-il utiliser keydown ou keypress ?
keydown. L'événement keypress est obsolète et ne se déclenche pas pour les touches qui ne produisent pas de caractère, comme Échap ou les flèches.