关于全选与各个子checkbox的实现

先上一下效果图

点击全选的时候 按钮能够点击 所有checkbox被选中 （此处的包括真正的 checkbox）

当子复选框被一个个取消 全选按钮取消

全选取消 全部子checkbox取消 按钮不能点击 

当只有一个被选中 按钮也是可以实现点击的

 

$('.allcheck').click(function(){
        $(this).toggleClass('on');
        if($(this).hasClass('on')){
            //当判断 allcheck被选中 每一个被选中 按钮可点击
            $('.li').addClass('on');
            $('.btn').removeClass('no');
            $('input[type=checkbox]').attr('checked','checked');
        }else{
            $('.btn').addClass('no');
            $('.li').removeClass('on');
            $('input[type=checkbox]').removeAttr('checked');
        }
    });

/*每一子按钮被点击*/
    $('.li').click(function(){
        /*清*/
        $('input[type=checkbox]').removeAttr('checked');
        $(this).toggleClass('on').
        $('.li.on').find('input[type=checkbox]').attr('checked','checked');
        /*判断子复选框 只有有被选中 按钮可点击*/
        if($('.li.on').length){
            $('.btn').removeClass('no')
        }else{
            $('.btn').addClass('no');
            $('.allcheck').removeClass('on');
        }
    });