Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > Bagaimana untuk mendapatkan nilai radio dengan jquery

Bagaimana untuk mendapatkan nilai radio dengan jquery

WBOY
Lepaskan: 2023-05-28 16:47:29
asal
3423 orang telah melayarinya

jQuery ialah perpustakaan JavaScript bahagian hadapan yang sangat popular. Dalam pembangunan halaman harian, kami sering menggunakan elemen borang dan pemprosesan acara. Antaranya, mendapatkan nilai butang radio adalah keperluan biasa. Berikut akan memperkenalkan cara menggunakan jQuery untuk mendapatkan nilai butang radio.

Pertama, kita perlu menyediakan satu set kotak butang radio. Ambil kod berikut sebagai contoh:

<form>
  <input type="radio" name="gender" value="男"> 男
  <input type="radio" name="gender" value="女"> 女
</form>
Salin selepas log masuk

Nama dan nilai butang radio adalah sangat penting. Nama itu mengenal pasti sekumpulan butang radio, manakala nilai mewakili pengecam unik untuk setiap butang radio. Ambil perhatian bahawa setiap butang radio perlu mempunyai nama yang sama.

Seterusnya, kita boleh menggunakan pemilih jQuery untuk mendapatkan butang radio ini. Seperti yang ditunjukkan di bawah:

var $radios = $('input[name="gender"]');
Salin selepas log masuk

Pemilih ini menggunakan pemilih atribut untuk memilih semua butang radio bernama jantina.

Kini kami telah berjaya memperoleh satu set butang radio. Walau bagaimanapun, kita juga perlu tahu butang radio mana yang dipilih. Untuk mencapai fungsi ini, kita boleh menggunakan kaedah prop() dalam jQuery. Kaedah prop() digunakan untuk mendapatkan atau menetapkan nilai atribut sesuatu elemen. Ia boleh mendapatkan atribut unsur yang diperiksa untuk menentukan sama ada butang radio dipilih. Kodnya adalah seperti berikut:

var selectedValue = $radios.filter(':checked').prop('value');
Salin selepas log masuk

Dalam kod ini, kami menggunakan kaedah penapis() untuk memilih butang radio yang dipilih. Kemudian, gunakan kaedah prop() untuk mendapatkan nilai butang radio ini. Pembolehubah selectedValue mewakili nilai butang radio yang dipilih.

Akhir sekali, jika kita ingin mendapatkan teks label butang radio yang dipilih dan bukannya nilai, kita boleh menggunakan kaedah seterusnya() dalam jQuery untuk mendapatkan teks label Kodnya adalah seperti berikut:

var selectedLabelText = $radios.filter(':checked').next('label').text();
Salin selepas log masuk

Penerangan: Memandangkan butang radio biasanya mengawal beberapa perubahan keadaan, kami boleh meletakkan kod di atas dalam pengendali acara untuk dilaksanakan secara automatik apabila pengguna mengklik butang radio.

Kod di atas menunjukkan cara menggunakan jQuery untuk mendapatkan nilai butang radio. Dalam pembangunan halaman sebenar, kita mungkin perlu mengendalikan elemen dan peristiwa bentuk yang lebih kompleks, dan kita perlu menggunakan pelbagai kaedah dan teknik jQuery secara menyeluruh untuk menyelesaikan tugasan.

Atas ialah kandungan terperinci Bagaimana untuk mendapatkan nilai radio dengan jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan