Di jQuery, bagaimana cara memilih elemen berdasarkan atribut namanya?

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>

Di jQuery, saya ingin mendapatkan nilai dari tombol radio yang dipilih ketika salah satu dari ketiganya diklik. Di jQuery kita memiliki pemilih id (#) dan class (.), Tetapi bagaimana jika saya ingin menemukan tombol radio dengan namanya, seperti di bawah ini?

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

Tolong beri tahu saya cara mengatasi masalah ini.

Ini harus dilakukan, semua ini ada dalam dokumentasi , yang memiliki contoh yang sangat mirip dengan ini:

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

Saya juga harus mencatat Anda memiliki beberapa ID identik dalam cuplikan itu. Ini adalah HTML yang tidak valid. Gunakan kelas untuk mengelompokkan set elemen, bukan ID, karena mereka harus unik.

Untuk menentukan tombol radio mana yang dicentang, coba ini:

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

Acara akan ditangkap untuk semua tombol radio di grup dan nilai tombol yang dipilih akan ditempatkan di val.

Pembaruan: Setelah memposting, saya memutuskan bahwa jawaban Paolo di atas lebih baik, karena menggunakan lebih sedikit DOM traversal. Saya membiarkan jawaban ini berdiri karena ini menunjukkan cara mendapatkan elemen yang dipilih dengan cara yang kompatibel lintas-browser.

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

cara lain

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

Ini sangat bagus untuk saya. Misalnya Anda memiliki dua tombol radio dengan "nama" yang sama, dan Anda hanya ingin mendapatkan nilai yang dicentang. Anda dapat mencoba yang ini.

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

Kode berikut digunakan untuk mendapatkan nilai tombol radio yang dipilih berdasarkan nama

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

Adnan terima kasih

Saya menemukan pertanyaan ini ketika saya meneliti kesalahan setelah saya memutakhirkan dari 1.7.2 dari jQuery ke 1.8.2. Saya menambahkan jawaban saya karena ada perubahan pada jQuery 1.8 dan lebih tinggi yang mengubah cara pertanyaan ini dijawab sekarang.

Dengan jQuery 1.8 mereka telah mencabut pseudo-selectors seperti: radio,: checkbox,: text.

Untuk melakukan hal di atas sekarang ganti saja :radiodengan [type=radio].

Jadi jawaban Anda sekarang menjadi untuk semua versi jQuery 1.8 ke atas:

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

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

Bagi siapa pun yang tidak ingin memasukkan perpustakaan untuk melakukan sesuatu yang sangat sederhana:

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

jsfiddle

Untuk tinjauan umum kinerja jawaban saat ini, periksa di sini

Jika Anda ingin mengetahui nilai dari tombol radio default yang dipilih sebelum acara klik, coba ini:

peringatan ($ ("masukan: radio: dicentang"). val ());

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

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

Ini url biola

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

<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>

Jika Anda menginginkan nilai benar / salah, gunakan ini:

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

Mungkin sesuatu seperti ini?

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

Ketika Anda mengklik tombol radio apa pun, saya percaya itu akan berakhir dipilih, jadi ini akan dipanggil untuk tombol radio yang dipilih.

Jika Anda memiliki lebih dari satu grup tombol radio pada halaman yang sama Anda juga dapat mencoba ini untuk mendapatkan nilai tombol radio:

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

Bersulang!

juga dapat menggunakan kelas CSS untuk menentukan rentang tombol radio dan kemudian menggunakan yang berikut untuk menentukan nilainya

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

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"). masing-masing (function () {
        if ($ (this) .is (': checked'))
        lansiran ($ (ini) .val ());
    });

Semoga ini bisa membantu ..

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

Anda mungkin memperhatikan menggunakan pemilih kelas untuk mendapatkan nilai ASP.NET RadioButton kontrol selalu kosong dan inilah alasannya.

Anda membuat RadioButtonkontrol ASP.NETseperti di bawah ini:

<asp:RadioButton runat="server" ID="rbSingle" GroupName="Type" CssClass="radios" Text="Single" />
<asp:RadioButton runat="server" ID="rbDouble" GroupName="Type" CssClass="radios" Text="Double" />
<asp:RadioButton runat="server" ID="rbTriple" GroupName="Type" CssClass="radios" Text="Triple" />

Dan ASP.NETmenjadikan HTML berikut untuk AndaRadioButton

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

Karena ASP.NETkami tidak ingin menggunakan RadioButtonnama kontrol atau id karena mereka dapat berubah karena alasan apa pun di luar kendali pengguna (perubahan nama wadah, nama formulir, nama kontrol pengguna , ...) seperti yang Anda lihat dalam kode di atas.

Satu-satunya cara yang layak yang tersisa untuk mendapatkan nilai dari RadioButtonmenggunakan jQuery adalah menggunakan kelas css seperti yang disebutkan dalam jawaban ini untuk pertanyaan yang sama sekali tidak terkait sebagai berikut

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