개발자의 끄적끄적

[jQuery] 체크박스 선택여부, checked처리 라디오버튼 선택과 해제 본문

개발/javascript & jquery

[jQuery] 체크박스 선택여부, checked처리 라디오버튼 선택과 해제

효벨 2020. 6. 12. 01:00
728x90
반응형

[jQuery] 체크박스 선택여부, checked처리 라디오버튼 선택과 해제

 

 

checked 여부 확인

1

2

$("input:checkbox[id='ID']").is(":checked") == true : false  /* by ID */

$("input:checkbox[name='NAME']").is(":checked") == true : false /* by NAME */



checked/unchecked 처리

1

2

$("input:checkbox[id='ID']").prop("checked", true); /* by ID */

$("input:checkbox[name='NAME']").prop("checked", false); /* by NAME */



특정 라디오버튼 선택 / 모든 라디오버튼 선택해제

1

2

$("input:radio[name='NAME']:radio[value='VALUE']").attr("checked",true);

$("input:radio[name='NAME']").removeAttr("checked");



전체선택 체크박스를 선택하면 그 아래의 모든 체크박스를 선택 HTML

1

2

3

4

5

<label><input type="checkbox" id="check_all" class="input_check"> <b>전체선택</b></label>

<ul class="select_subject">

<label><input type="checkbox" class="input_check" name="class[1]" value="1"> <b>1</b></label>

<label><input type="checkbox" class="input_check" name="class[2]" value="2"> <b>2</b></label>

</ul>

출처: https://hermeslog.tistory.com/327 [헤르메스 LIFE]

 

 

전체선택 체크박스를 선택하면 그 아래의 모든 체크박스를 선택 jQuery

1

2

3

4

5

6

7

$(function(){

    $("#check_all").click(function(){

        var chk = $(this).is(":checked");//.attr('checked');

        if(chk) $(".select_subject input").prop('checked', true);

        else  $(".select_subject input").prop('checked', false);

    });

});



출처: https://hermeslog.tistory.com/327 [헤르메스 LIFE]

반응형
Comments