Как сбросить radiobuttons в jQuery, чтобы никто не проверялся

у меня есть переключатели в HTML, как это:

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

Это в теге формы, и когда пользователь отправляет форму, я хочу, чтобы все переключатели вернулись к умолчанию. То есть никто из них не проверял.

у меня есть этот код, но он дает сообщение об ошибке [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;

Я делаю это в IE 6.

12 ответов


в версиях jQuery до 1.6 используйте:

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

в версиях jQuery после 1.6 вы должны использовать:

$('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 размыло различие, предоставив один метод,.attr, для доступа к обоим типам значений. в jQuery 1.6+ предоставляет два метода, .attr и .prop чтобы различать эти ситуации.

.prop позволяет задать свойство для элемента DOM, в то время как .attr позволяет чтобы задать значение атрибута HTML. Если вы работаете с plain DOM и установите свойство checked,elem.checked, to true или false вы изменяете текущее значение (то, что видит пользователь), и возвращаемое значение отслеживает состояние страницы. возвращает только начальное состояние (и возвращает 'checked' или undefined в зависимости от начального состояния из HTML). В 1.6.1+, используя .attr('checked', false) и elem.removeAttribute('checked') и elem.checked = false поскольку изменение вызвало много проблем с обратной совместимостью, и это не могу сказать, хотите ли вы установить атрибут HTML или свойство DOM. Смотрите дополнительную информацию в разделе документация .опора.


лучший способ установить состояние radiobuttons в 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

код 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">

и если вы имеете дело со списком radiobutton, вы можете использовать селектор :checked, чтобы получить только тот, который вы хотите.

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

установите все переключатели по умолчанию:

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