Cách đặt lại radiobuttons trong jQuery để không bị kiểm tra

Tôi có các nút radio trong HTML như thế này:

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

Đây là trong một thẻ biểu mẫu và khi người dùng gửi biểu mẫu tôi muốn làm cho tất cả các nút radio trở về mặc định. Có nghĩa là không ai trong số họ kiểm tra.

Tôi có mã này nhưng nó báo lỗi [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;

Tôi đang làm điều này trong IE 6.

Trong các phiên bản jQuery trước 1.6, hãy sử dụng:

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

Trong các phiên bản jQuery sau 1.6, bạn nên sử dụng:

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

nhưng nếu bạn đang sử dụng 1.6.1+, bạn có thể sử dụng mẫu đầu tiên (xem ghi chú 2 bên dưới).

Lưu ý 1: điều quan trọng là đối số thứ hai là sai và không "sai" vì "false" không phải là giá trị giả. I E

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

Lưu ý 2: Kể từ jQuery 1.6.0, hiện có hai phương thức tương tự nhau .attrvà .propthực hiện hai điều liên quan nhưng hơi khác nhau. Nếu trong trường hợp cụ thể này, lời khuyên cung cấp ở trên hoạt động nếu bạn sử dụng 1.6.1+. Ở trên sẽ không hoạt động với 1.6.0, nếu bạn đang sử dụng 1.6.0, bạn nên nâng cấp. Nếu bạn muốn biết chi tiết, hãy tiếp tục đọc.

Thông tin chi tiết: Khi làm việc với các phần tử HTML DOM thẳng, có tài sản gắn liền với yếu tố DOM ( checked, type, value, vv) mà cung cấp một giao diện sang trạng thái hoạt động của các trang HTML. Ngoài ra còn có giao diện .getAttribute/ .setAttributecung cấp quyền truy cập vào các giá trị Thuộc tính HTML như được cung cấp trong HTML. Trước 1.6 jQuery làm mờ sự khác biệt bằng cách cung cấp một phương thức .attr, để truy cập cả hai loại giá trị. jQuery 1.6+ cung cấp hai phương thức .attrvà .propđể phân biệt giữa các tình huống này.

.propcho phép bạn đặt thuộc tính trên thành phần DOM, đồng thời .attrcho phép bạn đặt giá trị thuộc tính HTML. Nếu bạn đang làm việc với DOM đơn giản và đặt thuộc tính được kiểm tra elem.checked, thành truehoặc falsebạn thay đổi giá trị đang chạy (những gì người dùng nhìn thấy) và giá trị được trả về sẽ theo dõi trạng thái trên trang. elem.getAttribute('checked')tuy nhiên chỉ trả về trạng thái ban đầu (và trả về 'checked'hoặc undefinedtùy thuộc vào trạng thái ban đầu từ HTML). Trong 1.6.1+, việc sử dụng .attr('checked', false)cả hai elem.removeAttribute('checked')và elem.checked = falsedo thay đổi đã gây ra nhiều vấn đề tương thích ngược và thực sự không thể biết bạn muốn đặt thuộc tính HTML hay thuộc tính DOM. Xem thêm thông tin trong tài liệu cho .prop .

Cách tốt nhất để đặt trạng thái radiobuttons trong 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

Mã Jquery (1.4+) để chọn trước một nút:

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

Trong mã Jquery 1.6+, phương thức .prop () được ưu tiên:

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

Để bỏ chọn các nút:

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

Vấn đề của bạn là bộ chọn thuộc tính không bắt đầu bằng @ .

Thử cái này:

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

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

Or

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

Cuối cùng, sau rất nhiều thử nghiệm, tôi nghĩ cách đặt trước thuận tiện và hiệu quả nhất là:

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

Việc làm mới là bắt buộc với đối tượng JQueryUI.

Lấy giá trị rất dễ dàng:

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

Đã thử nghiệm với JQuery 1.6.1, JQuery UI 1.8.

Tôi biết điều này đã cũ và đây là một chủ đề nhỏ, nhưng giả sử bạn muốn bỏ chọn chỉ các nút radio cụ thể trong một bộ sưu tập:

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

Và nếu bạn đang xử lý danh sách radiobutton, bạn có thể sử dụng bộ chọn: đã chọn để lấy chỉ cái bạn muốn.

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

Nút radio được kiểm tra thông qua 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>

mã jquery:

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

Nếu bạn muốn xóa tất cả các nút radio trong 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');

Mặc dù prop đã thay đổi trạng thái đã kiểm tra nhưng thay đổi cũng cho thấy rằng trong biểu mẫu.

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

Ở đâu mà bạn có: <input type="radio" name="enddate" value="1" />

Sau value = "1" bạn cũng có thể chỉ cần thêm unchecked =" false" />

Dòng sau đó sẽ là:

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

Đặt tất cả các nút radio trở về mặc định:

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

Tại sao bạn không làm:

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