Як скинути радіо кнопки в 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.

У версіях jQuery до 1.6 використовувати:

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

У версіях jQuery після 1.6 слід використовувати:

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

але якщо ви використовуєте 1.6.1+, ви можете скористатися першою формою (див. примітку 2 нижче).

Примітка 1: важливо, щоб другий аргумент був помилковим, а не "хибним", оскільки "false" не є хибним значенням. тобто

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. Якщо ви працюєте з простим DOM і встановити перевіряється майно, elem.checkedдо trueабо falseзмінити йде значення (то , що бачить користувач) і значення , повернуті відстежує стан на стор. elem.getAttribute('checked')однак повертає лише початковий стан (і повертає 'checked'або undefinedзалежно від початкового стану від HTML). У 1.6.1+ використання використовує .attr('checked', false)і те, elem.removeAttribute('checked')і інше, elem.checked = falseоскільки зміна спричинила багато проблем із сумісністю назад, і він не може насправді визначити, чи хотіли ви встановити атрибут HTML або властивість DOM. Додаткову інформацію див. У документації для .prop .

Найкращий спосіб встановити стан радіо кнопок у 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">

А якщо ви маєте справу зі списком радіобудів, ви можете скористатись вибраним селектором, щоб отримати саме той, який ви хочете.

$("#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"]').prop('checked', false).change();

Де у вас є: <input type="radio" name="enddate" value="1" />

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

Лінія буде:

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

Повернення всіх перемикачів назад до стандартних:

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

Чому б не зробити:

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