(제이쿼리) 게시글 전체 선택 체크박스 만들기

        $(document).on("click", "#checkAll", function(){
            //전체 선택 클릭
            if($("#checkAll").is(":checked")){
                $(".checkSingle").prop("checked", true);
            }else{
                $(".checkSingle").prop("checked", false);

            }
        })

        //단일 선택 클릭
        $(document).on("click", ".checkSingle", function() {
            var total =  $(".checkSingle").length;
            var checked = $(".checkSingle:checked").length;

            console.log("total " , total)
            console.log("checked " , checked)

            if(total != checked){
                $("#checkAll").prop("checked", false);
            }else{
                $("#checkAll").prop("checked", true);

            }
        })

if문 설명

1. 전체 체크 박스

'전체 체크 박스' 클릭 시 '단일 체크 박스' 활성화 / 비활성화

    if($("#checkAll").is(":checked")){
        $(".checkSingle").prop("checked", true);
    }else{
        $(".checkSingle").prop("checked", false);

    }

 

2. 단일 체크 박스

'단일 체크 박스'를 모두 다 클릭하게 되면 '전체 선택 체크 버튼'이 활성화 된다는 의미

    if(total != checked){
        $("#checkAll").prop("checked", false);
    }else{
        $("#checkAll").prop("checked", true);

    }