Atur radio yang dipilih dari grup radio dengan nilai

153

Mengapa saya bergumul dengan ini?

Saya memiliki nilai: 5

Bagaimana cara memeriksa tombol radio grup "grup saya" dengan nilai 5?

$("input[name=mygroup]").val(5); // doesn't work?
dcolumbus
sumber

Jawaban:

351

Dengan bantuan pemilih atribut, Anda dapat memilih elemen input dengan nilai yang sesuai. Maka Anda harus mengatur atribut secara eksplisit, menggunakan .attr:

var value = 5;
$("input[name=mygroup][value=" + value + "]").attr('checked', 'checked');

Sejak jQuery 1.6, Anda juga dapat menggunakan .propmetode dengan nilai boolean (ini harus menjadi metode yang disukai):

$("input[name=mygroup][value=" + value + "]").prop('checked', true);

Ingat Anda pertama-tama perlu menghapus atribut yang dicentang dari salah satu tombol radio di bawah satu grup tombol radio saja, maka Anda akan dapat menambahkan properti / atribut yang dicentang ke salah satu tombol radio di grup tombol radio tersebut.

Kode Untuk Menghapus Atribut yang Diperiksa dari semua tombol radio dari satu grup tombol radio -

$('[name="radioSelectionName"]').removeAttr('checked');
Felix Kling
sumber
.prop ('checked', true) mungkin lebih baik atau .is ()
bladefist
3
@bladefist: .istidak akan membantu di sini, tapi saya setuju .prop. Itu tidak tersedia saat itu;) Akan memperbarui jawaban saya. Terima kasih!
Felix Kling
4
Jika nilai tombol radio memiliki desimal, Anda harus memberi nilai dalam tanda kutip
Robert
1
@ Robert: Ya, mungkin. Dari dokumentasi : "Dapat berupa kata tunggal tanpa kutip atau string yang dikutip."
Felix Kling
5
Lihat jawaban Jonathan. Dokumen jQuery menunjukkan yang .val()mendukung nilai pengaturan di radio atau grup kotak centang. Cara ini secara teknis berfungsi, tetapi bundaran dan jauh lebih mudah dibaca / berkesan.
jinglesthula
144

Ada cara yang lebih baik untuk memeriksa radio dan kotak centang; Anda harus meneruskan array nilai ke metode val alih-alih nilai mentah

Catatan: Jika Anda hanya meneruskan nilai dengan sendirinya (tanpa berada di dalam array ), itu akan menghasilkan semua nilai "grup saya" yang disetel ke nilai tersebut.

$("input[name=mygroup]").val([5]);

Berikut ini adalah dokumen jQuery yang menjelaskan cara kerjanya: http://api.jquery.com/val/#val-value

Dan .val([...])juga bekerja dengan unsur-unsur bentuk seperti <input type="checkbox">, <input type="radio">, dan <option>s dalam sebuah <select>.

Input dan opsi yang memiliki nilai yang cocok dengan salah satu elemen array akan diperiksa atau dipilih, sedangkan yang memiliki nilai yang tidak cocok dengan salah satu elemen array akan dicentang atau tidak dipilih

Fiddle mendemonstrasikan ini berfungsi: https://jsfiddle.net/92nekvp3/

Jonathan Pasquier
sumber
Jawaban yang diterima (well, seharusnya). Pada jQuery 1.0, lihat contoh terakhir dari docs (gulir ke bawah): api.jquery.com/val Disalin di sini: jsfiddle.net/JoePC/w1f9ykso
JoePC
Ini adalah cara yang bagus dan konsisten untuk mengatur semua nilai input. Sayang sekali aku butuh 6 tahun untuk mempelajarinya.
Jeff Lowery
1
Menghabiskan beberapa saat untuk mencari tahu mengapa semua nilai saya di grup diatur ke nilai yang diteruskan alih-alih memeriksa nilai. Ternyata saya melewati nilai dengan sendirinya, bukan di dalam array.
OXiGEN
14

Coba ini:

$('input:radio[name="mygroup"][value="5"]').attr('checked',true);

Demo JS Fiddle .

David mengatakan mengembalikan Monica
sumber
1
@ Pemburu, terima kasih ... hari ini jelas bukan hari saya untuk jQuery ... = /
David mengatakan mengembalikan Monica
8
$("input[name='mygroup'][value='5']").attr("checked", true);
pemburu
sumber
7

Ketika Anda mengubah nilai atribut seperti yang disebutkan di atas changeacara tidak dipicu jadi jika diperlukan karena beberapa alasan Anda dapat memicunya seperti itu

$('input[name=video_radio][value="' + r.data.video_radio + '"]')
       .prop('checked', true)
       .trigger('change');
Jean-Marc Amon
sumber
4

$("input[name='RadioTest'][value='2']").prop('checked', true);

Demo biola JS

karan
sumber
1

Atau Anda bisa menulis atribut nilai padanya:

$(':radio[value=<yourvalue>]').attr('checked',true);

Ini bekerja untuk saya.

Ketan
sumber
0
var key = "Name_radio";
var val = "value_radio";
var rdo = $('*[name="' + key + '"]');
if (rdo.attr('type') == "radio") {
 $.each(rdo, function (keyT, valT){
   if ((valT.value == $.trim(val)) && ($.trim(val) != '') && ($.trim(val) != null))

   {
     $('*[name="' + key + '"][value="' + (val) + '"]').prop('checked', true);
   }
  })
}
Amin Fathi
sumber
4
Bisakah Anda jelaskan apa yang kode Anda lakukan dalam jawaban Anda? Setidaknya satu atau lebih kalimat. Dan bagaimana itu memecahkan solusinya. Terima kasih.
Alex
0

Versi JavaScript murni:

document.querySelector('input[name="myradio"][value="5"]').checked = true;
JukkaV
sumber
-1
$('input[name="mygroup"]').val([5])
Anjitha
sumber
1
Bisakah Anda menjelaskan apa yang membuat solusi Anda berbeda dari solusi lain yang sudah disediakan?
Giovani Vercauteren
@Giovani Vercauteren, kita harus memberikan nama sebagai string. Jadi saya berikan mygroup sebagai string dalam kode.
Anjitha