아무것도 선택하지 않도록 jQuery에서 라디오 버튼을 재설정하는 방법

아무것도 선택하지 않도록 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 에서이 작업을 수행하고 있습니다.

---

1.6 이전의 jQuery 버전에서는 다음을 사용하십시오.

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

1.6 이후의 jQuery 버전에서는 다음을 사용해야합니다.

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

그러나 1.6.1 이상을 사용하는 경우 첫 번째 양식을 사용할 수 있습니다 (아래 참고 2 참조).

주 1 : 이 두 번째 인수는 것이 중요하다 거짓 이 아닌 "false"로 부터 "거짓" falsy 값이 아닙니다. 즉

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, valueHTML 페이지의 실행 상태에 대한 인터페이스를 제공, 등). HTML에 제공된 HTML 속성 값에 대한 액세스를 제공 하는 .getAttribute/ .setAttribute인터페이스 도 있습니다 . 1.6 이전에는 jQuery가 .attr두 가지 유형의 값 모두에 액세스 할 수있는 한 가지 방법 인을 제공하여 구별을 흐리게했습니다 . jQuery를 1.6은 두 가지 방법을 제공합니다, .attr그리고 .prop이러한 상황을 구별 얻을.

.propDOM 요소에 .attr속성을 설정하고 HTML 속성 값을 설정할 수 있습니다. 당신은 일반 DOM 및 설정 확인 속성을 사용하여 작업하는 경우 elem.checked에 true또는 false당신이 실행 값 (사용자가 보는 것을) 및 페이지 상태에서 값 반환 추적하는 변경합니다. elem.getAttribute('checked')그러나 초기 상태를 반환 (반환 'checked'또는 undefinedHTML에서 초기 상태에 따라 다름). 사용 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">

라디오 버튼 목록을 다루는 경우 : 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');

---

prop가 확인 된 상태를 변경했지만 change도 양식에 표시됩니다.

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

---

모든 라디오 버튼을 기본값으로 다시 설정하십시오.

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

---

Where you have: <input type="radio" name="enddate" value="1" />

After value= "1" you can also just add unchecked =" false" />

The line will then be:

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

---

Why don't you do:

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

참고URL : https://stackoverflow.com/questions/977137/how-to-reset-radiobuttons-in-jquery-so-that-none-is-checked