Como redefinir os botões de opção no jQuery para que nenhum seja verificado

Eu tenho botões de opção em HTML assim:

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

Isso está em uma tag de formulário e, quando o usuário envia um formulário, quero fazer com que todos os botões de opção retornem ao padrão. Significando que nenhum deles foi verificado.

Eu tenho esse código, mas dá um erro dizendo [0] is null or not an object

$('input[@name="correctAnswer"]')[0].checked = false;
$('input[@name="correctAnswer"]')[1].checked = false;
$('input[@name="correctAnswer"]')[2].checked = false;
$('input[@name="correctAnswer"]')[3].checked = false;

Estou fazendo isso no IE 6.

Nas versões do jQuery anteriores à 1.6, use:

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

Nas versões do jQuery após a versão 1.6, você deve usar:

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

mas se você estiver usando 1.6.1+, poderá usar o primeiro formulário (consulte a nota 2 abaixo).

Nota 1: é importante que o segundo argumento seja falso e não "falso", pois "falso" não é um valor falso. ie

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

Nota 2: A partir do jQuery 1.6.0, agora existem dois métodos semelhantes, .attre .propque fazer duas coisas relacionadas, mas ligeiramente diferentes. Se, nesse caso em particular, as recomendações fornecidas acima funcionarem se você usar o 1.6.1+. O acima não funcionará com o 1.6.0, se você estiver usando o 1.6.0, atualize. Se você quiser os detalhes, continue lendo.

Detalhes: Ao trabalhar com elementos DOM HTML normal, há propriedades ligados ao elemento DOM ( checked, type, value, etc), que fornece uma interface para o estado de execução da página HTML. Há também a interface .getAttribute/ .setAttributeque fornece acesso aos valores de atributo HTML, conforme fornecido no HTML. Antes da versão 1.6, o jQuery embaçava a distinção fornecendo um método,, .attrpara acessar os dois tipos de valores. O jQuery 1.6+ fornece dois métodos .attre .propé possível distinguir entre essas situações.

.proppermite definir uma propriedade em um elemento DOM, enquanto .attrpermite definir um valor de atributo HTML. Se você estiver trabalhando com o DOM simples e definir a propriedade marcada,, elem.checkedpara trueou falsealtere o valor em execução (o que o usuário vê) e o valor retornado rastreia o estado da página. elem.getAttribute('checked')no entanto, retorna apenas o estado inicial (e retorna 'checked'ou undefineddepende do estado inicial do HTML). No 1.6.1+, o uso de .attr('checked', false)ambos elem.removeAttribute('checked')e elem.checked = falseuma vez que a alteração causou muitos problemas de compatibilidade com versões anteriores, não é possível saber se você deseja definir o atributo HTML ou a propriedade DOM. Veja mais informações na documentação para .prop .

A melhor maneira de definir o estado dos botões de opção no jquery:

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

Código Jquery (1.4+) para pré-selecionar um botão:

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

No código do Jquery 1.6+, o método .prop () é preferido:

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

Para desmarcar os botões:

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

Seu problema é que o seletor de atributos não inicia com a @.

Tente o seguinte:

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

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

Or

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

Finalmente, depois de muitos testes, acho que a maneira mais conveniente e eficiente de predefinir é:

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

A atualização é necessária com o objeto JQueryUI.

Recuperar o valor é fácil:

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

Testado com o JQuery 1.6.1, JQuery UI 1.8.

Sei que isso é antigo e que isso é um pouco fora de tópico, mas suponha que você deseje desmarcar apenas botões de opção específicos em uma coleção:

$("#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">

E se você estiver lidando com uma lista de botões de opção, poderá usar o seletor: selected para obter exatamente o que deseja.

$("#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">

Conjunto de botões de opção verificado no 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>

código jquery:

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

Se você deseja limpar todos os botões de opção no 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');

Embora prop tenha alterado o status verificado, a alteração também mostra isso no formulário.

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

Onde você tem: <input type="radio" name="enddate" value="1" />

Após o valor = "1", você também pode adicionar unchecked =" false" />

A linha será então:

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

Defina todos os botões de opção de volta ao padrão:

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

Por que você não faz:

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