Comment appuyer sur la touche Entrée par programme en javascript

Comment appuyer sur la touche Entrée par programme en javascript

En parcourant Internet, nous rencontrons des sites Web où il est nécessaire de remplir un formulaire particulier. Dans de tels cas, l'appuyer sur la touche Entrée par programme en JavaScript est très utile pour faire face aux informations incomplètes saisies à l'avance. Avant de passer à l'étape suivante, cette fonctionnalité peut également aider à remplir les champs.

Ce manuel discutera des méthodes pour appuyer sur programmatiquement la touche Entrée en JavaScript.

Comment appuyer sur la touche Entrée par programme en javascript?

Pour appuyer sur la touche Entrée par programme en utilisant JavaScript, les approches suivantes peuvent être utilisées:

    • "document.addEventListener ()" méthode
    • "document.QuerySelector ()" méthode
    • "document.getElementByid ()" méthode

Passer par les méthodes mentionnées une par une!

Méthode 1: Appuyez sur la touche Entrée par programme dans JavaScript à l'aide du document.Méthode addEventListener ()

Le "document.addEventListener ()»La méthode fusionne un gestionnaire d'événements à un document. Cette méthode peut être implémentée pour ajouter l'événement spécifié pour détecter chaque fois que la touche ENTER est enfoncée.

Syntaxe

document.AddeventListener (événement, fonction)


Dans la syntaxe ci-dessus, le terme «événement"Fait référence à l'événement qui invoquera le spécifié"fonction"Quand il est déclenché.

L'idée indiquée ci-dessus est indiquée dans l'exemple ci-dessous.

Exemple

Dans l'exemple suivant, nous appliquerons le «document.addEventListener ()"Méthode et ajoutez un événement nommé"touche Bas". Cela se traduira par la notification de l'utilisateur lorsque le «Entrer»La touche est enfoncée via Alerte:

document.addEventListener ("keydown", (e) =>
si (e.key == "Entrée")
alert ("Entrer la touche est enfoncé")

);


La sortie correspondante sera:

Méthode 2: Appuyez sur la touche Entrée par programme en JavaScript à l'aide du document.Méthode QueySelector ()

Le "document.QuerySelector ()”La méthode obtient le premier élément qu'un sélecteur CSS correspond. Cette méthode peut être utilisée pour accéder à un élément particulier, modifier sa valeur et l'afficher sur le modèle d'objet de document (DOM) lorsque la touche Entrée est enfoncée.

Syntaxe

document.QueySelector (sélecteurs CSS)


Ici, "Sélecteurs CSS»Fait référence à un ou plusieurs sélecteurs CSS.

Regardez l'exemple suivant.

Exemple

Tout d'abord, nous ajouterons le titre suivant en utilisant le «

" étiqueter:

Résultat


Ensuite, appliquez le «document.QuerySelector ()»Méthode pour accéder à l'en-tête spécifié:

LET ENTERKEY = Document.queySelector ("H1");


Maintenant, joignez un événement nommé «touche Bas" en utilisant le "document.addEventListener ()»Méthode discutée dans la méthode précédente. Ici, placez également une condition pour le «Entrer”Touche qui vérifie si la touche Entrée est appuyée:

document.addEventListener ("keydown", (e) =>
si (e.key == "Entrée")
la touche Entrée.innerText = "Entrée La touche est enfoncée";

);


Sortir


Dans la sortie ci-dessus, on peut observer que le «texte de texte»La propriété modifie le texte DOM en appuyant sur le«Entrer" clé.

Méthode 3: Appuyez sur la touche Entrée par programme dans JavaScript à l'aide du document.Méthode GetElementById ()

Le "document.getElementByid ()»La méthode accède à un élément avec l'ID spécifié. Cette méthode peut être utilisée pour identifier la touche Entrée lorsqu'un utilisateur entre dans le texte dans le champ de saisie.

Syntaxe

document.GetElementByid (EleMedId)


Dans la syntaxe susmentionnée, «élémentID»Représente l'ID de l'élément auquel nous voulons accéder.

Exemple

Tout d'abord, incluez une rubrique utilisant le «

Remplissez le champ de saisie


Dans l'étape suivante, créez un champ de saisie pour entrer dans le texte avec le suivant "identifiant" et "espace réservé" valeurs:


Ensuite, récupérez l'ID attribué en utilisant le «document.getElementByid ()" méthode:

LET ENTERKEY = Document.getElementByid ("entrée")


Enfin, appliquez le «addEventListener ()"Méthode et joindre l'événement nommé"touche Bas«Sur le champ de saisie pour détecter si la touche Entrée est enfoncée et le notifie à l'aide de la boîte de dialogue d'alerte:

la touche Entrée.addEventListener ("keydown", (e) =>
si (e.key == "Entrée")
alert ("Entrer la touche est enfoncé")

)


Sortir


Nous avons compilé différentes méthodes pour appuyer sur la touche Entrée par programme dans JavaScript.

Conclusion

Pour appuyer sur la touche Entrée par programme en JavaScript, utilisez le «document.addEventListener ()«Méthode pour attacher un événement particulier et notifier l'utilisateur si la touche Entrée est enfoncée via une alerte, le«document.QuerySelector ()«Méthode pour afficher l'état de la touche Entrée appuyée sur le DOM ou le«document.getElementByid ()«Méthode pour appliquer une vérification de la clé Entrée sur un champ de saisie. Cet article a démontré les méthodes pour appuyer sur programmatiquement la touche Entrée en JavaScript.