Come impostare il valore di un campo di input nascosto tramite JavaScript?

Durante la creazione di un modulo o di un questionario, può esserci un requisito per allocare un valore di input dell'utente in un campo specifico. Ad esempio, aggiungendo voci riservate, io.e., una password o un valore codificato per utilizzarli. In tali casi, l'impostazione del valore di un elemento di input nascosto tramite JavaScript aiuta a mantenere i dati sicuri e sicuri.

Questo blog discuterà la procedura per impostare il valore di un campo di input nascosto tramite JavaScript

Come impostare il valore di un campo di input nascosto tramite JavaScript?

Per impostare il valore del campo di input nascosto tramite JavaScript, applicare gli approcci di seguito:

• "Innerhtml" proprietà.
• "jQuery"

Metodo 1: impostare il valore dell'elemento nascosto tramite proprietà interna

IL "Innerhtml"La proprietà restituisce il contenuto HTML dell'elemento. Questa proprietà può essere utilizzata per impostare e aggiungere il valore definito dall'utente al campo di input nascosto allocato.

Sintassi:

elemento.InnerHtml = testo

Nella sintassi sopra, "elemento"Si riferisce all'elemento che deve essere aggiunto al"testo" valore.

Esempio

Passiamo attraverso l'esempio di seguito:

Nel blocco del codice sopra:

• In primo luogo, crea il campo di input con gli attributi dichiarati.
• IL "tipo"Attributo con il valore"nascosto"Significa che si tratta di un campo nascosto.
• Dopodiché, il "richiesta"Dialogue casella prende un valore dall'utente.
• Ora, applica un controllo sul valore definito dall'utente in modo tale che non lo sia "nullo" usando il "Se" condizione.
• Infine, accedi al campo di input nascosto con il suo "id" usando il "getElementById ()"Metodo e imposta il valore definito dall'utente su di esso tramite"Innerhtml" proprietà.
• Infine, visualizza il valore aggiunto tramite un avviso.

Produzione

Come osservato, il valore dell'utente-input viene aggiunto al campo di input nascosto.

Metodo 2: impostare il valore dell'elemento nascosto usando l'approccio jQuery

In questo approccio, "JQuery"Val ()"Il metodo verrà utilizzato per allocare il valore del campo di testo di input visibile nel campo di input nascosto.

Esempio

Proviamo il seguente codice:

Immettere il valore per l'elemento nascosto

Invia

Nelle righe di codice sopra:

• In primo luogo, includi un campo di testo di input con gli attributi dichiarati.
• Allo stesso modo, allocare un altro campo di input nascosto, come evidente dal suo "tipo"Attributo.
• Tag aggiunto con uno specifico "id"Attributo.
• Successivamente, includi la Biblioteca JQuery con l'aiuto del "src"Attributo nel""Tag.
• Nel codice JS, accedi al pulsante creato e associa il "SU()"Metodo con esso per eseguire la funzione sul pulsante Clicca.
• Nella definizione della funzione, accedi all'input visibile "testo”Campo e prenderne il valore usando il"Val ()" metodo.
• Nel passaggio successivo, il valore recuperato verrà assegnato all'input nascosto "testo"Campo tramite il"Val ()" metodo.
• Infine, visualizza il valore risultante allocato al "campo di input nascosto"Tramite un avviso.

Produzione

Nell'output sopra, si può vedere che il valore dell'ingresso visibile "testo"Il campo è assegnato al"nascosto" Campo di inserimento.

Conclusione

Per impostare il valore di un campo di input nascosto tramite JavaScript, applicare il “Innerhtml"Proprietà o JQuery"Val ()" metodo. La proprietà InnerHTML può essere utilizzata per applicare la funzionalità desiderata aggiungendo il valore definito dall'utente. Il metodo Val () può essere applicato per allocare il valore del campo di testo di input visibile al campo di input nascosto Questo blog ha discusso della procedura per impostare il valore di un campo di input nascosto tramite JavaScript.