Comment capturer un arrière-pas sur l'événement Keydown?

Lors de la création d'une page Web ou d'un site convivial, il peut y avoir une exigence pour empêcher l'utilisateur d'appuyer sur une touche particulière tout en remplissant un formulaire ou un questionnaire. Par exemple, la restriction de l'utilisateur pour modifier ou annuler les données déjà entrées. Dans de tels scénarios, la capture d'un backpace sur un événement Keydown est utile à la fin du développeur.

Cet article élaborera les approches pour capturer un arrière-pas de l'événement Keydown en JavaScript.

Comment capturer un arrière-pas de l'événement Keydown dans un élément spécifique?

Le "addEventListener ()»La méthode associe un événement à un élément, et la propriété Keycode fait référence à un code qui signifie une pression. Ces approches peuvent être utilisées pour attacher un événement au champ de saisie récupéré et informer l'utilisateur dès que la touche particulière est appuyée sur elle (champ de saisie).

Syntaxe

élément.AddeventListener (événement, fonction, userCapture);

Dans la syntaxe ci-dessus:

• • "événement»Correspond à l'événement qui doit être attaché.
  • "fonction»Le paramètre correspond à la fonction qui doit être exécutée lorsque l'événement est déclenché.
  • "usercapture"Est un paramètre facultatif.

Exemple

Passons par le code-snippet indiqué ci-dessous:

Détecter la touche arrière

Dans le bloc de code ci-dessus:

• • Tout d'abord, incluez une rubrique dans le «

    " étiqueter.

  • Dans la prochaine étape, allouer un «saisir texte"Field ayant le déclaré"identifiant".
  • Dans le code JavaScript, accédez au champ de texte d'entrée créé par son «identifiant" en utilisant le "getElementByid ()" méthode.
  • Après cela, associez le «addEventListener ()”Méthode avec l'élément récupéré (champ de saisie). Dans les paramètres de la méthode, l'ancien paramètre, je.e., "touche Bas»Signifie le nom de l'événement et ce dernier paramètre fait référence à la fonction qui doit être invoquée sur l'événement déclenché.
  • Dans la définition de la fonction, appliquez le «code clé»Propriété avec le code indiqué faisant référence au«Arrière«Clé dans le«si" condition.
  • Sur l'état satisfait, l'alerte avec le message indiqué sera affichée sur le modèle d'objet document (DOM).

Sortir

Dans la sortie, on peut voir qu'en appuyant sur la touche arrière, l'utilisateur est informé avec le message déclaré via une alerte.

Comment capturer un espace arrière sur l'événement Keydown n'importe où dans l'ensemble du modèle d'objet de document (DOM)?

Dans cet exemple particulier, un espace arrière sera capturé à l'aide du keycode spécifié sous la forme d'un «cas«Dans la fonction qui doit être exécutée sur l'événement déclenché:

Détecter la touche arrière

Dans les lignes de code ci-dessus:

• • De même, inclut la rubrique indiquée dans le «

    " étiqueter.

  • Dans la partie JavaScript du code, de même, appliquez le «addEventListener ()"Méthode ayant l'événement joint nommé"touche Bas»Et le nom de fonction comme paramètres, respectivement.
  • Après cela, définissez une fonction nommée «keycheck ()”Avoir le paramètre déclaré.
  • Dans sa définition, associez le «code clé”Propriété avec le paramètre passé afin que le code de clé correspondant contre la clé soit détecté lors de l'événement déclenché.
  • Enfin, appliquez le «commutateur / boîtier”Déclaration telle que le keycode particulier contre la touche arrière est invoquée par le"cas»Instruction, et le message correspondant sera affiché via l'alerte.

Sortir

Dans cette sortie, on peut voir que l'exigence souhaitée a été atteinte.

Conclusion

Pour capturer un arrière-pas sur le «touche Bas»Événement dans JS, utilisez la combinaison du«addEventListener ()"Méthode et le"code clé" propriété. Le premier exemple utilise ces approches pour capturer la clé particulière dans un élément spécifique. Ce dernier exemple peut être utilisé pour détecter la touche arrière dans tout le DOM. Ce blog a discuté des approches pour capturer BackSpace sur l'événement Keydown en JavaScript.