Semasa membuat borang atau soal selidik, mungkin terdapat keperluan untuk memperuntukkan nilai input pengguna kepada medan tertentu. Contohnya, menambahkan entri sulit, iaitu kata laluan atau nilai yang dikodkan untuk menggunakannya. Dalam kes sedemikian, menetapkan nilai elemen input tersembunyi melalui JavaScript membantu dalam memastikan data selamat dan terjamin.
Blog ini akan membincangkan prosedur untuk menetapkan nilai medan input tersembunyi melalui JavaScript
Bagaimana untuk Menetapkan Nilai Medan Input Tersembunyi melalui JavaScript?
Untuk menetapkan nilai medan input tersembunyi melalui JavaScript, gunakan pendekatan yang dinyatakan di bawah:
Kaedah 1: Tetapkan Nilai Elemen Tersembunyi Melalui InnerHTML Property
' innerHTML sifat ” mengembalikan kandungan HTML elemen. Sifat ini boleh digunakan untuk menetapkan dan menambahkan nilai yang ditentukan pengguna pada medan input tersembunyi yang diperuntukkan.
Sintaks:
element.innerHTML = teks
Dalam sintaks di atas, ' unsur ” merujuk kepada unsur yang perlu disertakan dengan “ teks ” nilai.
Contoh
Mari kita lihat contoh yang dinyatakan di bawah:
< input menaip = 'tersembunyi' ID = 'elemen tersembunyi' nilai = '' >< skrip >
biarkan myInput = gesaan ( 'Sila masukkan Teks anda' , '' ) ;
jika ( myInput ! = null ) {
biarkan x = document.getElementById ( 'elemen tersembunyi' ) .innerHTML = 'Nilai elemen tersembunyi ialah: ' + myInput;
amaran ( x )
}
skrip >
Dalam blok kod di atas:
- Pertama, buat medan input yang mempunyai atribut yang dinyatakan.
- ' menaip ' atribut dengan nilai ' tersembunyi ” menandakan bahawa ia adalah medan yang tersembunyi.
- Selepas itu, ' segera ” kotak dialog mengambil nilai daripada pengguna.
- Sekarang, gunakan semakan pada nilai yang ditentukan pengguna supaya ia bukan ' null ' menggunakan ' jika ” syarat.
- Akhir sekali, akses medan input tersembunyi dengan ' ID ' menggunakan ' getElementById() ' kaedah dan tetapkan nilai yang ditentukan pengguna kepadanya melalui ' innerHTML ” harta.
- Akhir sekali, paparkan nilai yang dilampirkan melalui makluman.
Pengeluaran
Seperti yang diperhatikan, nilai input pengguna dilampirkan pada medan input tersembunyi.
Kaedah 2: Tetapkan Nilai Elemen Tersembunyi Menggunakan Pendekatan jQuery
Dalam pendekatan ini, jQuery ' val() ” kaedah akan digunakan untuk memperuntukkan nilai medan teks input yang boleh dilihat kepada medan input tersembunyi.
Contoh
Mari kita tinjau kod berikut:
< hlm > Masukkan nilai untuk unsur tersembunyi hlm >< input ID = 'myInput' nilai = '' menaip = 'teks' />< br >
< input ID = 'elemen tersembunyi' menaip = 'tersembunyi' nilai = '' />
< br >
< butang ID = 'btnShow' > Hantar butang >
< skrip src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js' > skrip >
< skrip >
$ ( '#btnShow' ) .pada ( 'klik' , fungsi ( ) {
biarkan inputValue = $ ( '#myInput' ) .val ( ) ;
$ ( '#hiddenElement' ) .val ( nilai input ) ;
amaran ( 'Nilai Elemen tersembunyi ialah : ' + nilai input ) ;
} ) ;
skrip >
Dalam baris kod di atas:
- Pertama, masukkan medan teks input yang mempunyai atribut yang dinyatakan.
- Begitu juga, peruntukkan satu lagi medan input tersembunyi, seperti yang terbukti daripada ' menaip ” atribut.
- Menambah tag
- Selepas itu, masukkan perpustakaan jQuery dengan bantuan ' src atribut ' dalam '
” tag. - Dalam kod JS, akses butang yang dibuat dan kaitkan ' pada() ” kaedah dengannya untuk melaksanakan fungsi pada klik butang.
- Dalam definisi fungsi, akses input yang boleh dilihat ' teks medan ” dan ambil nilainya menggunakan “ val() ” kaedah.
- Dalam langkah seterusnya, nilai yang diambil akan diperuntukkan kepada input tersembunyi ' teks medan ” melalui “ val() ” kaedah.
- Akhir sekali, paparkan nilai terhasil yang diperuntukkan kepada “ medan input tersembunyi ” melalui amaran.
Pengeluaran
Dalam output di atas, dapat dilihat bahawa nilai input yang boleh dilihat ' teks medan ” diperuntukkan kepada “ tersembunyi ” medan input.
Kesimpulan
Untuk menetapkan nilai medan input tersembunyi melalui JavaScript, gunakan ' innerHTML 'harta atau jQuery' val() ” kaedah. Sifat innerHTML boleh digunakan untuk menggunakan fungsi yang diingini dengan menambahkan nilai yang ditentukan pengguna. Kaedah val() boleh digunakan untuk memperuntukkan nilai medan teks input yang boleh dilihat kepada medan input tersembunyi Blog ini membincangkan prosedur untuk menetapkan nilai medan input tersembunyi melalui JavaScript.