Comment détecter la touche Espace
document.addEventListener('keydown', (event) => {
if (event.key === " ") {
// Space 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 dépréciés : ils fonctionnent encore, mais leurs valeurs varient selon les navigateurs et les dispositions de clavier.
Comment les navigateurs gèrent la touche Espace
La valeur de la touche est un simple caractère espace, et non « Space ». La touche Espace active les boutons et les cases à cocher, et fait défiler la page lorsqu’aucun autre élément ne la traite. Appelez preventDefault() si votre contrôle personnalisé l’utilise, sinon la page risque de sauter.
Dans React
<input onKeyDown={(e) => { if (e.key === " ") { /* … */ } }} />Recherche de keycode JavaScript
Appuyez sur une touche et découvrez immédiatement toutes les propriétés de l'événement clavier, avec un extrait keydown prêt à copier pour vos raccourcis.