JQuery로 Checkbox check여부 확인 및 Label 활용 방법.

  • Label로 묶어 주면 check button이 아니라 글자를 눌러도 check button 누르는 것 처럼 된다.

       <label><input type='checkbox' id='check_all' class='input_check' /> <b>Check me</b></label>

  • Checked 확인
    if ( true ==  $(“#check_all”).is(“:checked”) )
    {
    alert ( “checked” );
    } else
    {
    alert( ” un checked”);
    }
  • Check/ uncheck 처리
    $(“#check_all”).prop(“checked”, true );
    $(“#check_all”).prop(“checked”, false );
  • Exsample
    <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>

     

    <p>$(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);
        });
    });
    </p>