Kuriant formą ar klausimyną gali būti reikalaujama priskirti vartotojo įvesties reikšmę konkrečiam laukui. Pavyzdžiui, pridedant konfidencialius įrašus, t. y. slaptažodį arba užkoduotą reikšmę, kad juos būtų galima panaudoti. Tokiais atvejais paslėpto įvesties elemento vertės nustatymas naudojant „JavaScript“ padeda užtikrinti duomenų saugumą.
Šiame tinklaraštyje bus aptarta paslėpto įvesties lauko vertės nustatymo per „JavaScript“ procedūra
Kaip nustatyti paslėpto įvesties lauko vertę naudojant „JavaScript“?
Norėdami nustatyti paslėpto įvesties lauko vertę naudodami „JavaScript“, taikykite toliau nurodytus metodus:
1 būdas: nustatykite paslėpto elemento vertę naudodami vidinę HTML ypatybę
„ vidinis HTML “ ypatybė grąžina elemento HTML turinį. Šią ypatybę galima naudoti norint nustatyti ir pridėti vartotojo nustatytą reikšmę prie priskirto paslėpto įvesties lauko.
Sintaksė:
element.innerHTML = tekstas
Aukščiau pateiktoje sintaksėje „ elementas “ reiškia elementą, kurį reikia pridėti su „ tekstą “ vertė.
Pavyzdys
Panagrinėkime toliau pateiktą pavyzdį:
< įvestis tipo = 'paslėpta' id = 'paslėptas elementas' vertė = '' >< scenarijus >
leisti myInput = raginimas ( 'Prašome įvesti savo tekstą' , '' ) ;
jeigu ( mano įvestis ! = null ) {
leisti x = document.getElementById ( 'paslėptas elementas' ) .innerHTML = 'Paslėpto elemento vertė yra: + myInput;
budrus ( x )
}
scenarijus >
Aukščiau esančiame kodo bloke:
- Pirmiausia sukurkite įvesties lauką su nurodytais atributais.
- „ tipo ' atributas su reikšme ' paslėptas “ reiškia, kad tai yra paslėptas laukas.
- Po to „ paraginti “ dialogo langas paima reikšmę iš vartotojo.
- Dabar patikrinkite vartotojo nustatytą reikšmę, kad ji nebūtų „ nulinis ' naudojant ' jeigu “ sąlyga.
- Galiausiai pasiekite paslėptą įvesties lauką naudodami „ id ' naudojant ' getElementById() “ metodą ir nustatykite vartotojo nustatytą reikšmę naudodami „ vidinis HTML ' nuosavybė.
- Galiausiai perspėjimu parodykite pridėtą reikšmę.
Išvestis
Kaip pastebėta, vartotojo įvesties reikšmė pridedama prie paslėpto įvesties lauko.
2 būdas: nustatykite paslėpto elemento vertę naudodami jQuery metodą
Taikant šį metodą, „jQuery“ val() “ metodas bus naudojamas matomo įvesties teksto lauko vertei priskirti paslėptam įvesties laukui.
Pavyzdys
Apžvelkime šį kodą:
< p > Įveskite vertę dėl paslėptas elementas p >< įvestis id = 'mano įvestis' vertė = '' tipo = 'tekstas' />< br >
< įvestis id = 'paslėptas elementas' tipo = 'paslėpta' vertė = '' />
< br >
< mygtuką id = 'btnShow' > Pateikti mygtuką >
< scenarijus src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js' > scenarijus >
< scenarijus >
$ ( „#btnShow“ ) .įjungta ( 'spustelėkite' , funkcija ( ) {
leisti inputValue = $ ( „#mano įvestis“ ) .val ( ) ;
$ ( „#hiddenElement“ ) .val ( inputValue ) ;
budrus ( 'Paslėpto elemento vertė yra:' + inputValue ) ;
} ) ;
scenarijus >
Aukščiau pateiktose kodo eilutėse:
- Pirma, įtraukite įvesties teksto lauką su nurodytais atributais.
- Taip pat paskirkite kitą paslėptą įvesties lauką, kaip matyti iš jo „ tipo “ atributas.
- Pridėta
- Po to įtraukite jQuery biblioteką naudodami „ src ' atributas '