programing

선택하지 않도록 jQuery의 라디오 버튼을 재설정하는 방법

javajsp 2023. 8. 2. 08:48

선택하지 않도록 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);

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

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

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

1: "false"는 거짓 값이 아니므로 두 번째 인수는 "false"가 아니라 "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을 사용하는 경우 업그레이드해야 합니다.자세한 내용을 알고 싶으면 계속 읽으세요.

세부 정보:straight HTML DOM 요소로 작업할 때 DOM 요소에 부착된 속성이 있습니다(checked,type,valueHTML 페이지의 실행 상태에 대한 인터페이스를 제공합니다.또한 다음과 같은 기능도 있습니다..getAttribute/.setAttributeHTML에 제공된 대로 HTML 속성 값에 대한 접근을 제공하는 인터페이스. 1.6 jQuery가 하나의 방법을 제공함으로써 구별을 흐리게 하기 전에는,.attr두 가지 유형의 값에 모두 액세스합니다.jQuery 1.6+는 두 가지 방법을 제공합니다..attr그리고..prop이 상황들을 구별하기 위해.

.propDOM 요소에 속성을 설정할 수 있습니다..attrHTML 특성 값을 설정할 수 있습니다.만약 당신이 플레인 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">

또한 라디오 버튼 목록을 다루는 경우 :체크 표시된 선택기를 사용하여 원하는 목록을 얻을 수 있습니다.

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

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

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

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 type="radio" name="enddate" value="1" />

value = "1" 뒤에 다음을 추가할 수도 있습니다.unchecked =" false" />

그러면 다음 행이 됩니다.

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

모든 라디오 버튼을 기본값으로 설정합니다.

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

그렇게 하는 게 어때요?

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

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