Come premere INVIO CHIAVE CARAMMATIVA in JavaScript

Come premere INVIO CHIAVE CARAMMATIVA in JavaScript

Mentre attraversiamo Internet, incontriamo siti Web in cui è necessario compilare un modulo particolare. In tali casi, premere il tasto Invio a livello di programmazione in JavaScript è molto utile per far fronte alle informazioni incomplete inserite in anticipo. Prima di procedere alla fase successiva, questa funzione può anche aiutare a riempire i campi.

Questo manuale discuterà i metodi per premere a livello di programmazione la chiave di inserisci in JavaScript.

Come premere INVIO CHIAVE CARAMMATIVA in JavaScript?

Per premere INVIO il tasto Inserisci a livello di programmazione utilizzando JavaScript, è possibile utilizzare i seguenti approcci:

    • "documento.addEventListener ()" metodo
    • "documento.QuerySelector ()" metodo
    • "documento.getElementById ()" metodo

Passare attraverso i metodi menzionati uno per uno!

Metodo 1: premere INVIO il tasto Inserisci programmaticamente in JavaScript utilizzando il documento.Metodo addEventListener ()

IL "documento.addEventListener ()"Il metodo unisce un gestore di eventi a un documento. Questo metodo può essere implementato per aggiungere l'evento specificato per rilevare ogni volta che viene premuto il tasto ENTER.

Sintassi

documento.addEventListener (evento, funzione)


Nella sintassi sopra, il termine "evento"Si riferisce all'evento che invocherà il specificato"funzione"Quando viene attivato.

L'idea sopra indicata è mostrata nell'esempio seguente.

Esempio

Nel seguente esempio, applicheremo il "documento.addEventListener ()"Metodo e aggiungere un evento chiamato"keydown". Ciò comporterà la notifica dell'utente quando il "accedere"Il tasto viene premuto tramite avviso:

documento.addEventListener ("keydown", (e) =>
Se (e.key == "enter")
Avviso ("Il tasto ENTER è premuto")

);


L'output corrispondente sarà:

Metodo 2: premere INVIO il tasto Inserisci programmaticamente in JavaScript utilizzando il documento.Metodo QuerySelector ()

IL "documento.QuerySelector ()"Il metodo ottiene il primo elemento che un selettore CSS corrisponde. Questo metodo può essere utilizzato per accedere a un determinato elemento, modificarlo e visualizzarlo sul modello Object Model (DOM) quando viene premuto il tasto.

Sintassi

documento.QuerySelector (selettori CSS)


Qui, "Selettori CSS"Si riferisce a uno o più di un selettore CSS.

Guarda il seguente esempio.

Esempio

Innanzitutto, aggiungeremo la seguente intestazione usando "

"Tag:

Risultato


Successivamente, applica il “documento.QuerySelector ()"Metodo per accedere all'intestazione specificata:

Let EnterKey = Document.QuerySelector ("H1");


Ora, allega un evento chiamato "keydown" usando il "documento.addEventListener ()"Metodo discusso nel metodo precedente. Qui, colloca anche una condizione per "accedere"Tasto che controlla se viene premuto il tasto Enter:

documento.addEventListener ("keydown", (e) =>
Se (e.key == "enter")
tasto Invio.InnerText = "INVIO il tasto ENTR è premuto";

);


Produzione


Nell'output sopra, si può osservare che il "testo interno"La proprietà cambia il testo DOM dopo aver premuto il"accedere" chiave.

Metodo 3: premere INVIO il tasto Inserisci programmaticamente in JavaScript utilizzando il documento.metodo getElementById ()

IL "documento.getElementById ()"Il metodo accede a un elemento con l'ID specificato. Questo metodo può essere utilizzato per identificare il tasto Invio quando un utente inserisce il testo nel campo di input.

Sintassi

documento.getElementByID (elementID)


Nella sintassi sopra menzionata, "Elementid"Rappresenta l'ID dell'elemento a cui vogliamo accedere.

Esempio

Innanzitutto, includi un'intestazione usando il "

Riempi il campo di input


Nel passaggio successivo, crea un campo di input per inserire il testo con quanto segue "id" E "segnaposto" valori:


Successivamente, prendi l'ID assegnato usando "documento.getElementById ()" metodo:

Let EnterKey = Document.getElementById ("Input")


Infine, applica il "addEventListener ()"Metodo e allegare l'evento chiamato"keydown"Sul campo di input per rilevare se il tasto ENTER viene premuto e avvisarlo utilizzando la finestra di dialogo Avviso:

tasto Invio.addEventListener ("keydown", (e) =>
Se (e.key == "enter")
Avviso ("Il tasto ENTER è premuto")

)


Produzione


Abbiamo compilato metodi diversi per premere INVIO CHIAVE CARAMMATIVA in JavaScript.

Conclusione

Per premere INVIO il tasto Inserisci programmaticamente in JavaScript, utilizza il “documento.addEventListener ()"Metodo per allegare un particolare evento e avvisare l'utente se il tasto ENTER viene premuto tramite un avviso,"documento.QuerySelector ()"Metodo per visualizzare lo stato del tasto ENTER pressato sul DOM o sul"documento.getElementById ()"Metodo per l'applicazione di una verifica della chiave Immettere su un campo di input. Questo articolo ha dimostrato i metodi per premere a livello di programmazione la chiave di inserisci in JavaScript.