通过jQuery选择时，单选按钮的所有值都无法获取？

Question

我的jQuery功能是：

$(function() {
     $('#small').click(function() {
             var selectedRB = $('input[name=radioGroup]:checked').val();
         alert(selectedRB);
     });
})

HTML：

<input type="radio" id="small" name="radioGroup" value="small" checked><label for="inpSmall">Small</label><br>

<input type="radio" id="small" name="radioGroup" value="medium"><label for="inpMedium">Medium</label><br>

<input type="radio" id="small" name="radioGroup" value="large"><label for="inpLarge">Large</label><br><br>

我遇到的问题是我只获得第一个值，小，当我点击其他按钮时它没有返回值。

Answer 1

描述

问题是您使用了ID small。 ID必须在您的文档中是唯一的。请改用class。查看我的示例和jSFiddle。

  

id属性指定HTML元素的唯一ID（id属性值在HTML文档中必须是唯一的。）

示例

<强> HTML

<input type="radio" class="small" name="radioGroup" value="small" checked><label for="inpSmall">Small</label><br>

<input type="radio" class="small" name="radioGroup" value="medium"><label for="inpMedium">Medium</label><br>

<input type="radio" class="small" name="radioGroup" value="large"><label for="inpLarge">Large</label><br><br>

<强>的jQuery

$(function() {
     $('.small').click(function() {

               var selectedRB = $('input[name=radioGroup]:checked').val();
               alert(selectedRB);
       });
})

更多信息

• 的 jSFiddle
• HTML id Attribute

Answer 2

ID是唯一的，您不能为多个元素提供相同的ID。 试试这个：

$('input[name=radioGroup]').change(function() {     
    var selectedRB = $('input[name=radioGroup]:checked').val();
    alert(selectedRB);
 });

Answer 3

//add some class to your radio buttons like class="someClass"
$(function() {
     $('.someClass').click(function() {     
            var selectedRB = $('input[name=radioGroup]:checked').val();
        alert(selectedRB);
     });
})