Når du opretter en formular eller et spørgeskema, kan der være et krav om at allokere en brugerinputværdi til et specifikt felt. For eksempel ved at tilføje fortrolige poster, dvs. et kodeord eller en kodet værdi for at bruge dem. I sådanne tilfælde hjælper indstilling af værdien af et skjult input-element gennem JavaScript med at holde dataene sikre.
Denne blog vil diskutere proceduren for at indstille værdien af et skjult inputfelt gennem JavaScript
Hvordan indstilles værdien af et skjult inputfelt gennem JavaScript?
For at indstille værdien af det skjulte inputfelt via JavaScript skal du anvende nedenstående fremgangsmåder:
Metode 1: Indstil værdien af det skjulte element via indreHTML-egenskab
Det ' indreHTML ” egenskab returnerer elementets HTML-indhold. Denne egenskab kan bruges til at indstille og tilføje den brugerdefinerede værdi til det tildelte skjulte inputfelt.
Syntaks:
element.innerHTML = tekst
I ovenstående syntaks, ' element ' refererer til det element, der skal tilføjes med ' tekst 'værdi.
Eksempel
Lad os gennemgå nedenstående eksempel:
< input type = 'skjult' id = 'skjultElement' værdi = '' >< manuskript >
lade myInput = prompt ( 'Indtast venligst din tekst' , '' ) ;
hvis ( mit input ! = null ) {
lade x = document.getElementById ( 'skjultElement' ) .innerHTML = 'Værdien af skjult element er: ' + myInput;
alert ( x )
}
manuskript >
I ovenstående kodeblok:
- Først skal du oprette inputfeltet med de angivne attributter.
- Det ' type ' attribut med værdien ' skjult ” betyder, at det er et skjult felt.
- Derefter vil ' hurtig ” dialogboksen tager en værdi fra brugeren.
- Anvend nu en kontrol på den brugerdefinerede værdi, så den ikke er ' nul ' bruger ' hvis ' tilstand.
- Til sidst, få adgang til det skjulte inputfelt ved dets ' id ' bruger ' getElementById() '-metoden og indstil den brugerdefinerede værdi til den via ' indreHTML ” ejendom.
- Vis endelig den tilføjede værdi via en advarsel.
Produktion
Som observeret føjes brugerinputværdien til det skjulte inputfelt.
Metode 2: Indstil værdien af det skjulte element ved hjælp af jQuery-metoden
I denne tilgang er jQuerys ' val() ” metoden vil blive brugt til at allokere værdien af det synlige input tekstfelt til det skjulte inputfelt.
Eksempel
Lad os gennemgå følgende kode:
< s > Indtast værdien til skjult element s >< input id = 'mit input' værdi = '' type = 'tekst' />< br >
< input id = 'skjultElement' type = 'skjult' værdi = '' />
< br >
< knap id = 'btnShow' > Indsend knap >
< manuskript src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js' > manuskript >
< manuskript >
$ ( '#btnShow' ) .på ( 'klik' , fungere ( ) {
lade inputValue = $ ( '#mit input' ) .val ( ) ;
$ ( '#skjultElement' ) .val ( inputVærdi ) ;
alert ( 'Værdien af skjult element er:' + inputværdi ) ;
} ) ;
manuskript >
I ovenstående kodelinjer:
- Inkluder først et inputtekstfelt med de angivne attributter.
- Tildel ligeledes et andet skjult inputfelt, som det fremgår af dets ' type ' attribut.
- Tilføjet
- Derefter skal du inkludere jQuery-biblioteket ved hjælp af ' src ' attribut i '