我有3个单选按钮在我的网页,如下所示:

<标签=“主题灰色”> <输入类型=“无线电” id=“主题-灰色” 名称=“主题” 值=“灰色” />灰色</label> <标签=“主题粉红色”> <输入类型=“收音机” id=“主题-粉红色” 名称=“主题” 值=“粉红色” />粉红色</label> <标签=“主题绿色”> <输入类型=“无线电” id=“主题-绿色” 名称=“主题” 值=“绿色” />绿色</label>

在jQuery中,我想在单击这三个按钮中的任何一个时获得所选单选按钮的值。在jQuery中,我们有id(#)和类(.)选择器,但如果我想找到一个单选按钮的名字,如下所示?

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

请告诉我如何解决这个问题。


当前回答

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

其他回答

这对我很有效。

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());
    });

希望能有所帮助。

也许是这样的?

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

当你点击任意单选按钮时,我相信它最终会被选中,所以这个会被调用用于选中的单选按钮。

我是在研究jQuery从1.7.2升级到1.8.2后的一个错误时发现这个问题的。我添加我的答案是因为jQuery 1.8及更高版本已经改变了这个问题的回答方式。

在jQuery 1.8中,他们已经弃用了伪选择器,如:radio,:checkbox,:text。

要完成上述操作,现在只需将:radio替换为[type=radio]。

所以你的答案现在变成了所有版本的jQuery 1.8及以上:

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

在附加信息部分的:radio选择器页面上,您可以阅读1.8自述文件上的更改和此更改的特定票据,并了解更改的原因。

这应该可以做到,所有这些都在文档中,其中有一个非常类似的例子:

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

我还应该注意到,在该代码片段中有多个相同的id。这是无效的HTML。使用类来对一组元素进行分组,而不是id,因为它们应该是唯一的。

要确定选中了哪个单选按钮,请尝试以下操作:

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

组中所有单选按钮的事件将被捕获,所选按钮的值将被放置在val中。

更新:在发帖后,我认为Paolo上面的答案更好,因为它少使用了一次DOM遍历。我保留这个答案,因为它展示了如何以跨浏览器兼容的方式获取所选元素。