从收音机组中选择一个收音机并设置一个值


153

我为什么要为此苦苦挣扎?

我有一个值:5

如何检查“ mygroup”组的单选按钮,其值为5?

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

Answers:


351

借助属性选择器,可以选择具有相应值的输入元素。然后,您必须使用显式设置属性.attr

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

从jQuery 1.6开始,您还可以使用.prop带有布尔值的方法(这应该是首选方法):

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

请记住,您只需要先从一个单选按钮组下的任何一个单选按钮中删除选中的属性,然后便可以将选中的属性/属性添加到该单选按钮组中的一个单选按钮中。

从一个单选按钮组的所有单选按钮中删除“已检查的属性”的代码-

$('[name="radioSelectionName"]').removeAttr('checked');

.prop('checked',true)可能更好
。.is

3
@bladefist:.is这里无济于事,但我同意.prop。当时还没有;)将更新我的答案。谢谢!
Felix Kling

4
如果单选按钮的值带有小数点,则需要将其用引号引起来
罗伯特·罗伯特(Robert

1
@Robert:是的,可能。在文档中“可以是未加引号的单个单词或带引号的字符串。”
2013年

5
参见乔纳森的答案。jQuery文档显示.val()支持在单选或复选框组上设置值。该答案的方法在技术上有效,但回旋处且可读性/难记性低得多。
jinglesthula

144

有一种更好的检查单选和复选框的方法。您必须将值数组传递给val方法,而不是原始值

注意:如果仅简单地自己传递值(而不是在array内),则将导致“ mygroup”的所有值均被设置为该值。

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

这是解释其工作原理的jQuery文档:http : //api.jquery.com/val/#val-value

而且.val([...])还与表单元素<input type="checkbox"><input type="radio"><option>S的一个内<select>

具有与数组元素之一匹配的值的输入和选项将被选中或选中,而具有与数组元素之一不匹配的值的输入和选项将被选中或取消选中

小提琴演示此工作:https : //jsfiddle.net/92nekvp3/


接受的答案(应该是)。从jQuery 1.0开始,请参见文档中的最后一个示例(滚动至底部):api.jquery.com/val在此处复制:jsfiddle.net/JoePC/w1f9ykso
JoePC '18

这是设置所有输入值的一种很好且一致的方法。太糟糕了,我花了6年时间来了解它。
杰夫·洛里

1
花了很长时间试图弄清楚为什么我组中的所有值都被设置为传递的值,而不是检查该值。原来,我是通过值本身传递的,而不是通过数组传递的。
OXiGEN


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

7

当您如上所述更改属性值时,change不会触发该事件,因此如果出于某些原因需要,您可以像这样触发它

$('input[name=video_radio][value="' + r.data.video_radio + '"]')
       .prop('checked', true)
       .trigger('change');


1

或者,您可以只向其中写入value属性:

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

这对我有用。


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

4
您能否解释一下您的代码在答案中的作用?至少一个句子左右。以及解决方案的方式。谢谢。
亚历克斯

0

纯JavaScript版本:

document.querySelector('input[name="myradio"][value="5"]').checked = true;

-1
$('input[name="mygroup"]').val([5])

1
您能解释一下什么使您的解决方案与已经提供的其他解决方案有所不同吗?
Giovani Vercauteren

@Giovani Vercauteren,我们应该使用字符串名称。因此,我将mygroup作为代码中的字符串提供。
安吉塔
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.