HTML 태그로 구성된 라디오 버튼에 checked 옵션 부여

 

<form name="frm" method="post" onsubmit="return false;">
    <div>
        <input type="radio" name="btnYn" id="btnYn1" value="1"/>
        <label for="btnYn1">1번</label>
    </div>
    <div>
        <input type="radio" name="btnYn" id="btnYn2" value="2"/>
        <label for="btnYn1">2번</label>
    </div>
    <div>
        <input type="radio" name="btnYn" id="btnYn3" value="3"/>
        <label for="btnYn1">3번</label>
    </div>
</form>

위와같이 라디오버튼에 대한 html코드가 구성되어있다.

 

<script>
    $("#btnYn1").prop("checked", false);
    $("#btnYn2").prop("checked", true);
    $("#btnYn3").prop("checked", false);
</script>

위코드처럼 두번째에 해당하는 #btnYn2 id 속성을 가진 라디오버튼에 checked옵션을 부여할 수 있다.

<script>
    $("form[name=frm]").find("input[name=btnYn][value=2]").prop("checked", true);
</script>

위처럼 한번에 옵션 부여가 가능하다.

 

name속성이 frm인 form태그에서 input name이 btnYn인 요소 중 value속성이 2인 요소를 찾은후 prop 함수를 통해 checked 속성을 부여하는 로직이다.