Comment détecter le verrouillage des majuscules en JavaScript : une approche simple et efficace ?

Détection du verrouillage des majuscules avec JavaScript : une approche simple et efficace

Déterminer si le verrouillage des majuscules est activé à l'aide de JavaScript pose un défi courant parmi les développeurs. Bien qu'il existe diverses solutions de contournement, elles impliquent souvent des méthodes complexes et gourmandes en ressources. Heureusement, il existe une solution simple qui élimine le besoin de boucles complexes ou de gestionnaires d'événements.

Utilisation de KeyboardEvent et getModifierState

Les navigateurs modernes fournissent l'objet KeyboardEvent, qui offre l'objet getModifierState fonction. Cette fonction renvoie l'état de touches de modification spécifiques, y compris le verrouillage des majuscules. Voici comment vous pouvez en tirer parti :

<code class="javascript">passwordField.addEventListener('keydown', function(event) {
  var caps = event.getModifierState && event.getModifierState('CapsLock');
  console.log(caps); // true when Caps Lock is on
});</code>

Dans cet exemple, nous attachons un écouteur d'événement keydown à un champ de saisie. Lorsqu'une touche est enfoncée, l'objet événement est capturé et la fonction getModifierState est utilisée pour vérifier l'état du verrouillage des majuscules. Si le verrouillage des majuscules est actif, il renvoie « vrai ». Cette approche est à la fois intuitive et économe en ressources, car elle s'appuie sur les fonctionnalités intégrées du navigateur sans nécessiter de solutions de contournement fastidieuses.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!