Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > Bagaimana untuk menetapkan pemilihan radio berdasarkan nilai dalam jquery

Bagaimana untuk menetapkan pemilihan radio berdasarkan nilai dalam jquery

PHPz
Lepaskan: 2023-04-17 10:46:50
asal
6439 orang telah melayarinya

Dengan perkembangan berterusan teknologi Internet, front-end sudah pasti salah satu bidang yang paling hangat. Dalam pembangunan bahagian hadapan, jquery ialah perpustakaan JavaScript yang sangat popular dan digunakan secara meluas dalam pembangunan dan penyelenggaraan pelbagai laman web dan aplikasi. Dalam artikel ini, saya akan memperkenalkan cara menggunakan jquery untuk menetapkan pemilihan radio berdasarkan nilai.

1. Pengenalan kepada kawalan radio

Kawalan radio juga dipanggil butang radio Ia adalah kawalan dalam bentuk HTML dan direka untuk membenarkan pengguna memilih hanya satu daripada berbilang pilihan . Kawalan radio biasanya dilaksanakan menggunakan satu set butang radio yang sama, disusun ke dalam kumpulan yang mana hanya satu boleh dipilih.

Dalam HTML, kawalan radio biasanya ditakrifkan menggunakan teg input, di mana atribut jenis ialah radio, atribut nama ialah nama set butang radio dan atribut nilai ialah nilai setiap butang radio, seperti yang ditunjukkan di bawah :

<input type="radio" name="gender" value="male"> Male<br>
<input type="radio" name="gender" value="female"> Female<br>
Salin selepas log masuk

2 Cara menggunakan jquery untuk menetapkan pemilihan radio berdasarkan nilai

Kadangkala, kita perlu menggunakan jquery untuk menetapkan keadaan kawalan radio yang dipilih secara dinamik. . Di bawah, saya akan memperkenalkan dua kaedah untuk mencapai kesan penetapan pemilihan radio berdasarkan nilai.

1. Gunakan kaedah attr

Kaedah attr digunakan untuk mendapatkan atau menetapkan nilai atribut yang ditentukan. Apabila memilih dan menyahtanda kawalan radio, anda boleh menggunakan kaedah ini untuk menetapkan nilai atribut yang diperiksa.

Sebagai contoh, kami mempunyai kumpulan kawalan radio dengan id jantina Kami boleh menggunakan kod berikut untuk menetapkan keadaan pilihan butang radio yang sepadan:

// 根据值设置radio选中
$("input[name='gender'][value='male']").attr("checked", true);

// 取消选中
$("input[name='gender'][value='female']").attr("checked", false);
Salin selepas log masuk

Seperti yang ditunjukkan di atas. , kita mula-mula lulus Pemilih memilih butang radio lelaki dan perempuan dalam borang, dan kemudian menggunakan kaedah attr untuk menetapkan nilai atributnya yang ditandai untuk melaksanakan operasi yang dipilih dan tidak ditanda.

2. Gunakan kaedah prop

Kaedah prop pada asasnya serupa dengan kaedah attr, yang digunakan untuk mendapatkan atau menetapkan nilai atribut elemen. Perbezaannya ialah kaedah prop digunakan untuk mengendalikan atribut Boolean, seperti diperiksa, dipilih, dilumpuhkan, dsb., manakala kaedah attr digunakan untuk mengendalikan atribut bukan Boolean.

Ia juga sangat mudah untuk menetapkan status kawalan radio yang diperiksa dan tidak ditanda melalui kaedah prop Anda juga perlu menggunakan pemilih yang sepadan untuk memilih kawalan radio, dan kemudian gunakan kaedah prop untuk menetapkan nilai atribut yang diperiksa.

Sebagai contoh, kod berikut boleh menetapkan status kawalan radio yang ditanda dan tidak ditanda berdasarkan nilainya:

// 根据值设置radio选中
$("input[name='gender'][value='male']").prop("checked", true);

// 取消选中
$("input[name='gender'][value='female']").prop("checked", false);
Salin selepas log masuk

3. Ringkasan

Dalam artikel ini, Saya memperkenalkan Terdapat dua cara untuk menetapkan pemilihan radio berdasarkan nilai dalam jquery, menggunakan kaedah attr dan kaedah prop. Kedua-dua kaedah adalah sangat mudah, cuma pilih kawalan radio melalui pemilih, dan kemudian gunakan kaedah attr atau prop untuk menetapkan nilai atribut yang diperiksa. Saya harap artikel ini dapat membantu semua orang apabila menghadapi masalah yang sama dalam pembangunan bahagian hadapan.

Atas ialah kandungan terperinci Bagaimana untuk menetapkan pemilihan radio berdasarkan nilai dalam 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