Как сбросить радиокнопки в 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 126
jquery html-form

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, etc) которые обеспечивают интерфейс к запущенному состоянию HTML-страницы. Существует также .getAttribute/.setAttribute интерфейс, который обеспечивает доступ к значениям атрибутов HTML, как это предусмотрено в HTML. До 1.6 jQuery размыл различие, предоставив один метод,.attr, чтобы получить доступ к обоим типам значений. в jQuery 1.6+ предоставляет два метода, .attr и .prop чтобы различать эти ситуации.

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

247

лучший способ установить состояние 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 + код the .предпочтителен метод prop ():

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

чтобы снять выделение с кнопок:

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

ваша проблема заключается в том, что селектор атрибутов не начинается с @.

попробуйте это:

$('input[name="correctAnswer"]').attr('checked', false);
10
$('#radio1').removeAttr('checked');
$('#radio2').removeAttr('checked');
$('#radio3').removeAttr('checked');
$('#radio4').removeAttr('checked');

Or

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

наконец, после многих тестов, я думаю, что наиболее удобный и эффективный способ предустановки является:

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.

4

Я знаю, что это старый и что это немного не по теме, но предположим, что вы хотите снять только определенные переключатели в коллекции:

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

набор переключателей проверен через 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");
0

Если вы хотите очистить все переключатели в DOM:

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

0
<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');
0

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

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

где у вас есть: <input type="radio" name="enddate" value="1" />

после значения= " 1 " вы также можете просто добавить unchecked =" false" />

тогда строка будет:

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

почему бы вам не сделать:

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