如何在jquery中重置单选按钮以便不选中任何按钮

在1.6之前的jquery版本中,使用:

$('input[name="correctAnswer"]').attr('checked', false);

在1.6之后的jquery版本中,应该使用:

$('input[name="correctAnswer"]').prop('checked', false);

但是,如果您使用的是1.6.1+,则可以使用第一个表单(请参见下面的注释2)。

注1: 第二个论点很重要 假 而不是 “假” 自从 “假” 不是一个错误的值。即

if ("false") {
    alert("Truthy value. You will see an alert");
}

注2: 从jquery 1.6.0开始,现在有两种类似的方法, .attr 和 .prop 这样做有两个相关但略有不同的事情。如果在这种特殊情况下,如果您使用1.6.1+,则上述建议有效。以上内容不适用于1.6.0,如果您使用1.6.0,则应进行升级。如果你想了解细节,继续阅读。

细节: 使用纯HTML DOM元素时,有一些属性附加到了DOM元素( checked , type , value 等)提供HTML页面运行状态的接口。还有 .getAttribute / .setAttribute 接口,提供对HTML中提供的HTML属性值的访问。在1.6之前,jquery通过提供一种方法模糊了区别, Atter ,以访问这两种类型的值。jquery 1.6+提供了两种方法, Atter 和 支柱 以区分这些情况。

支柱 允许您在DOM元素上设置属性,而 Atter 允许您设置HTML属性值。如果使用的是纯DOM并设置了checked属性, elem.checked ,为了 true 或 false 您可以更改运行值(用户看到的内容),返回的值将跟踪页面上的状态。 elem.getAttribute('checked') 但是,只返回初始状态(并返回 'checked' 或 undefined 取决于HTML的初始状态)。1.1.1+使用中 .attr('checked', false) 两者都做 elem.removeAttribute('checked') 和 elem.checked = false 因为更改导致了很多向后兼容性问题,它不能真正判断您是想设置html属性还是dom属性。在中查看更多信息 documentation for .prop .

在jquery中设置RadioButtons状态的最佳方法:

HTML:

<input type="radio" name="color" value="orange" /> Orange 
<input type="radio" name="color" value="pink" /> Pink 
<input type="radio" name="color" value="black" /> Black
<input type="radio" name="color" value="pinkish purple" /> Pinkish Purple

jquery(1.4+)预选择一个按钮的代码:

var presetValue = "black";
$("[name=color]").filter("[value='"+presetValue+"']").attr("checked","checked");

在jquery 1.6+代码中,首选.prop()方法:

var presetValue = "black";
$("[name=color]").filter("[value='"+presetValue+"']").prop("checked",true);

要取消选择按钮:

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

您的问题是属性选择器没有以 @ .

试试这个:

$('input[name="correctAnswer"]').attr('checked', false);

$('#radio1').removeAttr('checked');
$('#radio2').removeAttr('checked');
$('#radio3').removeAttr('checked');
$('#radio4').removeAttr('checked');

Or

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

最后,经过大量测试,我认为最方便和有效的预设方法是:

var presetValue = "black";
$("input[name=correctAnswer]").filter("[value=" + presetValue + "]").prop("checked",true);
$("input[name=correctAnswer]").button( "refresh" );//JQuery UI only

jqueryui对象需要刷新。

检索值很容易:

alert($('input[name=correctAnswer]:checked').val())

使用jquery 1.6.1、jquery ui 1.8测试。

我知道这很古老,而且这有点离题,但是假设您只想取消选中集合中特定的单选按钮:

$("#go").click(function(){
    $("input[name='correctAnswer']").each(function(){
      if($(this).val() !== "1"){
        $(this).prop("checked",false);
      }
    });
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input id="radio1" type="radio" name="correctAnswer" value="1">1</input>
<input id="radio2" type="radio" name="correctAnswer" value="2">2</input>
<input id="radio3" type="radio" name="correctAnswer" value="3">3</input>
<input id="radio4" type="radio" name="correctAnswer" value="4">4</input>
<input type="button" id="go" value="go">

如果你正在处理一个单选按钮列表,你可以使用:选中的选择器来得到你想要的。

$("#go").click(function(){
  $("input[name='correctAnswer']:checked").prop("checked",false);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input id="radio1" type="radio" name="correctAnswer" value="1">1</input>
<input id="radio2" type="radio" name="correctAnswer" value="2">2</input>
<input id="radio3" type="radio" name="correctAnswer" value="3">3</input>
<input id="radio4" type="radio" name="correctAnswer" value="4">4</input>
<input type="button" id="go" value="go">

通过jquery检查的单选按钮集:

<div id="somediv" >
 <input type="radio" name="enddate" value="1"  />
 <input type="radio" name="enddate" value="2"  />
 <input type="radio" name="enddate" value="3"  />
</div>

jQuery代码:

$('div#somediv input:radio:nth(0)').attr("checked","checked");

如果要清除DOM中的所有单选按钮:

$('input[type=radio]').prop('checked',false);

<div id="radio">
<input type="radio" id="radio1" name="radio"/><label for="radio1">Bar Chart</label>
<input type="radio" id="radio2" name="radio"/><label for="radio2">Pie Chart</label>
<input type="radio" id="radio3" name="radio"/><label for="radio3">Datapoint Chart</label>
</div>

$('#radio input').removeAttr('checked');
// Refresh the jQuery UI buttonset.                  
$( "#radio" ).buttonset('refresh');

虽然prop改变了选中的状态,但是change也显示在表单中。

$('input[name="correctAnswer"]').prop('checked', false).change();

将所有单选按钮设置回默认值:

$("input[name='correctAnswer']").checkboxradio( "refresh" );

你所在的地方: <input type="radio" name="enddate" value="1" />

在value=“1”之后,您还可以添加 unchecked =" false" />

然后该行将是:

<input type="radio" name="enddate" value="1" unchecked =" false" />

你为什么不这样做:

$("#radio1, #radio2, #radio3, #radio4").checked = false;