Quelle touche suis-je en train de presser ?
Appuyez sur n’importe quelle touche : cette page affiche son event.key, son event.code et son keyCode hérité. Par exemple, la touche A donne key "a", code "KeyA" et keyCode 65 ; la touche Entrée donne code "Enter" et keyCode 13.
Mode d’emploi
- Cliquez n’importe où sur la page, puis appuyez sur une touche de votre clavier. Inutile de cliquer dans un champ de saisie.
- Lisez dans le panneau le nom de la touche, le code physique et le keyCode hérité. Maintenez Maj, Ctrl, Alt ou Cmd pour voir l’état des modificateurs, et gardez une touche enfoncée pour voir s’allumer l’indicateur de répétition.
- Utilisez Copier pour reprendre les valeurs dans votre code. La liste ci-dessous garde les dix derniers appuis.
Méthode de calcul
Les navigateurs envoient un événement keydown à chaque appui. event.key est la valeur produite par la touche, comme "a", "A" ou "Enter", et elle change avec la disposition du clavier et la touche Maj. event.code est la touche physique, comme "KeyA", identique quelle que soit la disposition : c’est le bon choix pour les commandes d’un jeu.
event.keyCode est l’ancien code numérique. Il est obsolète, mais on le trouve encore dans de vieux scripts et du code de l’époque jQuery ; il est donc affiché. Pendant la composition avec une méthode de saisie (IME), il vaut 229. event.location indique où se trouve la touche : 0 standard, 1 gauche, 2 droite, 3 pavé numérique.
Pour que la page ne défile pas et n’ouvre pas l’aide pendant le test, l’outil annule l’action par défaut du navigateur pour la plupart des touches. Tab, Échap, F5, F11, F12 et les raccourcis avec Ctrl ou Cmd ne sont pas touchés. Les touches gérées par le système, comme Fn, le volume ou la luminosité, n’arrivent jamais à la page.
Questions fréquentes
Quelle différence entre event.key et event.code ?
event.key est ce que la touche saisit : il dépend de la disposition et de Maj. event.code est la position physique. Sur un clavier AZERTY français, la touche située à la place du Q donne code "KeyQ" mais key "a". Utilisez code pour les commandes de jeu et key pour les raccourcis qui dépendent d’un caractère.
Faut-il encore utiliser keyCode ?
Non. keyCode et which sont obsolètes. Dans du nouveau code, utilisez event.key ou event.code. Les nombres sont affichés pour lire ou corriger d’anciens scripts, où, par exemple, 13 est Entrée, 27 Échap et 32 Espace.
Pourquoi 229 ou "Process" s’affiche-t-il ?
Les méthodes de saisie du chinois, du japonais, du coréen et d’autres langues prennent la touche en premier pendant la composition du texte, donc le navigateur signale 229. Passez à une disposition anglaise si vous avez besoin des valeurs brutes.
Pourquoi mon raccourci ou ma touche multimédia n’apparaît-il pas ?
Le système ou le navigateur peut intercepter une touche avant que la page ne la voie. Ctrl+W, Alt+Tab, Cmd+Q et la rangée Fn de nombreux portables en sont des exemples. Si la page ne réagit pas, la touche n’atteint pas le code web.