Beim Erstellen eines Formulars oder eines Fragebogens kann es erforderlich sein, einem bestimmten Feld einen Benutzereingabewert zuzuweisen. Zum Beispiel das Anhängen vertraulicher Einträge, also eines Passworts oder eines verschlüsselten Werts, um sie zu verwenden. In solchen Fällen hilft das Festlegen des Werts eines verborgenen Eingabeelements über JavaScript dabei, die Daten sicher und geschützt zu halten.
In diesem Blog wird das Verfahren zum Festlegen des Werts eines verborgenen Eingabefelds über JavaScript erläutert
Wie setze ich den Wert eines versteckten Eingabefelds über JavaScript?
Um den Wert des versteckten Eingabefelds über JavaScript festzulegen, wenden Sie die unten angegebenen Ansätze an:
Methode 1: Legen Sie den Wert des verborgenen Elements über die innerHTML-Eigenschaft fest
Die ' innerHTML ”-Eigenschaft gibt den HTML-Inhalt des Elements zurück. Diese Eigenschaft kann verwendet werden, um den benutzerdefinierten Wert zu setzen und an das zugewiesene versteckte Eingabefeld anzuhängen.
Syntax:
element.innerHTML = Text
In der obigen Syntax „ Element “ bezieht sich auf das Element, das mit dem „ Text ' Wert.
Beispiel
Gehen wir das unten aufgeführte Beispiel durch:
< Eingang Art = 'versteckt' Ich würde = 'verstecktes Element' Wert = '' >< Skript >
Lassen myInput = Eingabeaufforderung ( 'Bitte geben Sie Ihren Text ein' , '' ) ;
wenn ( meineEingabe ! = null ) {
Lassen x = document.getElementById ( 'verstecktes Element' ) .innerHTML = 'Der Wert des versteckten Elements ist: ' + meineEingabe;
Alarm ( x )
}
Skript >
Im obigen Codeblock:
- Erstellen Sie zunächst das Eingabefeld mit den angegebenen Attributen.
- Die ' Art ” Attribut mit dem Wert “ versteckt “ bedeutet, dass es sich um ein verborgenes Feld handelt.
- Danach ist die „ prompt ” Dialogbox übernimmt einen Wert vom Benutzer.
- Überprüfen Sie nun den benutzerdefinierten Wert so, dass er nicht „ Null ' Verwendung der ' wenn ' Zustand.
- Greifen Sie schließlich auf das versteckte Eingabefeld über sein „ Ich würde ' Verwendung der ' getElementById() “-Methode und legen Sie den benutzerdefinierten Wert über die „ innerHTML ' Eigentum.
- Zeigen Sie schließlich den angehängten Wert über eine Warnung an.
Ausgabe
Wie beobachtet, wird der Benutzereingabewert an das verborgene Eingabefeld angehängt.
Methode 2: Legen Sie den Wert des verborgenen Elements mithilfe des jQuery-Ansatzes fest
Bei diesem Ansatz ist jQuerys „ wert() ”-Methode wird verwendet, um den Wert des sichtbaren Eingabetextfeldes dem verborgenen Eingabefeld zuzuweisen.
Beispiel
Sehen wir uns den folgenden Code an:
< p > Geben Sie den Wert ein Pro verstecktes Element p >< Eingang Ich würde = 'meineEingabe' Wert = '' Art = 'Text' />< Br >
< Eingang Ich würde = 'verstecktes Element' Art = 'versteckt' Wert = '' />
< Br >
< Knopf Ich würde = 'btnShow' > einreichen Knopf >
< Skript Quelle = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js' > Skript >
< Skript >
$ ( '#btnShow' ) .an ( 'klicken' , Funktion ( ) {
Lassen Eingabewert = $ ( '#meineEingabe' ) .val ( ) ;
$ ( '#verstecktesElement' ) .val ( eingegebener Wert ) ;
Alarm ( 'Der Wert des versteckten Elements ist: ' + Eingabewert ) ;
} ) ;
Skript >
In den obigen Codezeilen:
- Fügen Sie zunächst ein Eingabetextfeld mit den angegebenen Attributen hinzu.
- Ordnen Sie ebenfalls ein weiteres verstecktes Eingabefeld zu, erkennbar an dessen „ Art ” Attribut.
- Binden Sie danach die jQuery-Bibliothek mit Hilfe des „ Quelle ”-Attribut im “
' Schild. - Greifen Sie im JS-Code auf die erstellte Schaltfläche zu und verknüpfen Sie das „ an() ”-Methode damit, um die Funktion auf den Button-Klick auszuführen.
- Greifen Sie in der Funktionsdefinition auf den sichtbaren Eingang „ Text “-Feld und rufen Sie seinen Wert mit dem “ wert() ' Methode.
- Im nächsten Schritt wird der geholte Wert dem versteckten Eingang „ Text ”-Feld über das “ wert() ' Methode.
- Zeigen Sie schließlich den resultierenden Wert an, der dem „ verstecktes Eingabefeld “ über eine Warnung.
Ausgabe
In der obigen Ausgabe ist ersichtlich, dass der Wert der sichtbaren Eingabe „ Text “-Feld ist dem “ versteckt ' Eingabefeld.
Fazit
Um den Wert eines ausgeblendeten Eingabefelds über JavaScript festzulegen, wenden Sie das „ innerHTML „Eigenschaft oder die jQuery“ wert() ' Methode. Die innerHTML-Eigenschaft kann verwendet werden, um die gewünschte Funktionalität anzuwenden, indem der benutzerdefinierte Wert angehängt wird. Die Methode val() kann angewendet werden, um den Wert des sichtbaren Eingabetextfeldes dem versteckten Eingabefeld zuzuweisen. In diesem Blog wurde die Vorgehensweise beschrieben, um den Wert eines versteckten Eingabefelds über JavaScript zu setzen.