Dalam jQuery, bagaimana cara memilih elemen dengan atribut name?

Saya memiliki 3 tombol radio di halaman web saya, seperti di bawah ini:

<label for="theme-grey">
  <input type="radio" id="theme-grey" name="theme" value="grey" />Grey</label>
<label for="theme-pink">
  <input type="radio" id="theme-pink" name="theme" value="pink" />Pink</label>
<label for="theme-green">
  <input type="radio" id="theme-green" name="theme" value="green" />Green</label>

Dalam jQuery, saya ingin mendapatkan nilai yang dipilih tombol radio ketika salah satu dari tiga diklik. Dalam jQuery kita memiliki id (#) dan kelas (.) penyeleksi, tapi bagaimana jika saya ingin menemukan sebuah tombol radio dengan namanya, seperti di bawah ini?

$("<radiobutton name attribute>").click(function(){});

Tolong beritahu saya bagaimana untuk memecahkan masalah ini.

Mengomentari pertanyaan (5)
Larutan

Ini yang harus melakukannya, semua ini adalah di dokumentasi, yang sangat mirip contoh ini:

$("input[type='radio'][name='theme']").click(function() {
    var value = $(this).val();
});

Saya juga harus mencatat anda memiliki beberapa identik Id dalam cuplikan. Ini adalah tidak valid HTML. Menggunakan kelas untuk kelompok himpunan dari unsur, tidak IDs, karena mereka harus unik.

Komentar (7)

Untuk menentukan tombol radio diperiksa, coba ini:

$('input:radio[name=theme]').click(function() {
  var val = $('input:radio[name=theme]:checked').val();
});

Acara ini akan tertangkap untuk semua tombol radio dalam kelompok dan nilai dari tombol yang dipilih akan ditempatkan di val.

Update: Setelah postingan saya memutuskan bahwa Paolo's jawaban di atas adalah lebih baik, karena menggunakan satu kurang DOM traversal. Aku membiarkan jawaban ini berdiri sejak itu menunjukkan bagaimana untuk mendapatkan elemen yang dipilih dengan cara yang lintas-browser yang kompatibel.

Komentar (4)
$('input:radio[name=theme]:checked').val();
Komentar (2)

cara lain

$('input:radio[name=theme]').filter(":checked").val()
Komentar (3)

Ini karya besar untuk saya. Misalnya anda memiliki dua tombol radio yang sama "", dan anda hanya ingin mendapatkan nilai diperiksa satu. Anda dapat mencoba yang satu ini.

$valueOfTheCheckedRadio = $('[name=radioName]:checked').val();
Komentar (2)

Berikut kode ini digunakan untuk mendapatkan dipilih radio button value dengan nama

jQuery("input:radio[name=theme]:checked").val();

Terima kasih Adnan

Komentar (1)

Saya menemukan pertanyaan ini karena saya sedang meneliti kesalahan setelah saya upgrade dari 1.7.2 dari jQuery untuk 1.8.2. I'm menambahkan jawaban saya karena telah ada perubahan dalam jQuery 1.8 dan lebih tinggi bahwa perubahan bagaimana pertanyaan ini dijawab sekarang.

Dengan jQuery 1.8 mereka telah usang pseudo-selector seperti :radio, :checkbox, :teks.

Untuk melakukan hal di atas sekarang hanya mengganti :radio dengan [type=radio].

Jadi jawaban anda sekarang menjadi untuk semua versi jQuery 1.8 dan di atas:

$("input[type=radio][name=theme]").click(function() { 
    var value = $(this).val(); 
}); 

Anda dapat membaca tentang perubahan pada 1.8 readme dan tiket spesifik untuk perubahan ini serta mengerti mengapa pada :radio pemilih halaman di bawah bagian Informasi Tambahan.

Komentar (1)

Bagi siapa saja yang doesn't ingin memiliki sebuah perpustakaan untuk melakukan sesuatu yang benar-benar sederhana:

document.querySelector('[name="theme"]:checked').value;

[jsfiddle](http://jsfiddle.net/fyLL1dhu/)

Untuk ikhtisar kinerja saat ini jawaban cek di sini

Komentar (1)

Jika anda'd ingin tahu nilai default yang dipilih tombol radio sebelum acara klik, coba ini:

alert($("input:radio:diperiksa").val());
Komentar (0)

Anda dapat menggunakan fungsi filter jika anda memiliki lebih dari satu kelompok radio pada halaman, seperti di bawah ini

$('input[type=radio]').change(function(){
    var value = $(this).filter(':checked' ).val();
    alert(value);
});

Berikut ini adalah biola url

http://jsfiddle.net/h6ye7/67/

Komentar (0)
<input type="radio" name="ans3" value="help"> 
<input type="radio" name="ans3" value="help1">
<input type="radio" name="ans3" value="help2">

<input type="radio" name="ans2" value="test"> 
<input type="radio" name="ans2" value="test1">
<input type="radio" name="ans2" value="test2">

<script type="text/javascript">
  var ans3 = jq("input[name='ans3']:checked").val()
  var ans2 = jq("input[name='ans2']:checked").val()
</script>
Komentar (0)

Jika anda ingin benar/salah nilai, gunakan ini:

  $("input:radio[name=theme]").is(":checked")
Komentar (0)

Sesuatu seperti ini mungkin?

$("input:radio[name=theme]").click(function() { 
 ...
}); 

Ketika anda klik pada tombol radio, saya percaya itu akan berakhir dipilih, jadi ini akan dipanggil untuk memilih tombol radio.

Komentar (2)

Saya memiliki lebih dari satu kelompok tombol radio pada halaman yang sama anda juga dapat mencoba ini untuk mendapatkan nilai dari radio button:

$("input:radio[type=radio]").click(function() {
    var value = $(this).val();
    alert(value);
});

Cheers!

Komentar (0)

dapat juga menggunakan class CSS untuk mendefinisikan berbagai tombol radio dan kemudian menggunakan berikut untuk menentukan nilai

$('.radio_check:checked').val()
Komentar (0)

Ini bekerja untuk saya..

HTML:

<input type="radio" class="radioClass" name="radioName" value="1" />Test<br/>
<input type="radio" class="radioClass" name="radioName" value="2" />Practice<br/>
<input type="radio" class="radioClass" name="radioName" value="3" />Both<br/>

Jquery:

$(".radioClass").each(function() {
    if($(this).is(':checked'))
    alert($(this).val());
});

Semoga membantu..

Komentar (0)
$('input:radio[name=theme]').bind(
  'click',
  function(){
    $(this).val();
});
Komentar (0)

Anda mungkin melihat menggunakan class selector untuk mendapatkan nilai ASP.NET RadioButton kontrol selalu kosong dan berikut adalah alasannya.

Anda membuat RadioButton kontrol ASP.NET seperti di bawah ini:



Dan ASP.NET membuat HTML berikut untuk anda RadioButton

<span class="radios"><input id="Content_rbSingle" type="radio" name="ctl00$Content$Type" value="rbSingle" />Single</span>
<span class="radios"><input id="Content_rbDouble" type="radio" name="ctl00$Content$Type" value="rbDouble" />Double</span>
<span class="radios"><input id="Content_rbTriple" type="radio" name="ctl00$Content$Type" value="rbTriple" />Triple</span>

Untuk ASP.NET kami don't ingin menggunakan RadioButton kontrol nama atau id karena mereka dapat mengubah untuk alasan apapun dari pengguna's tangan (perubahan dalam wadah nama, bentuk, nama, usercontrol nama, ...) seperti yang anda lihat pada kode di atas.

Yang tersisa hanya layak untuk mendapatkan nilai RadioButton menggunakan jQuery adalah menggunakan class css seperti yang disebutkan dalam ini jawaban yang sama sekali tidak terkait pertanyaan sebagai berikut

$('span.radios input:radio').click(function() {
    var value = $(this).val();
});
Komentar (0)