php之三態checkbox

標籤：style   blog   io   ar   color   os   sp   java   on   

<div class="pnav-box" id="letter-a">
　　<div class="box-title">
　　　　<a class="btn-unfold" data-power="icon" data-v="close" href="javascript:;"></a>
　　　　<input data-checkbox="all" type="checkbox" value="1" name="power[]" id="power" />
　　　　<span class="pnav-letter">採購</span>
　　</div>
　　<ul class="box-list clear">
　　　　<li>
　　　　　　<a class="btn-fold" data-power="icon" data-v="open" href="javascript:;"></a>
　　　　　　<b>
　　　　　　　　<input data-checkbox="items" type="checkbox" value="1" name="power[]" id="power" /><a href="javascript:;">採購管理</a>
　　　　　　</b>
　　　　　　<h2 class="hide">
　　　　　　　　<input value="020101" id="cb020101" data-checkbox="item" type="checkbox" name="power[]" /><a href="javascript:;">下訂單</a>
　　　　　　</h2>
　　　　　　<h2 class="hide">
　　　　　　　　<input value="020102" id="cb020102" data-checkbox="item" type="checkbox" name="power[]" /><a href="javascript:;">支付</a>
　　　　　　</h2>
　　　　</li>
　　</ul>
</div>

$("[data-checkbox=all]").change(function() {        //子類全部操作        $(this).parent().next().find(":checkbox").prop("checked",this.checked);    });    $("[data-checkbox=items]").change(function(){        var p = $(this).parent().parent();        var checkedNum = p.parent().find("[data-checkbox=items]:checked").length;   //擷取被選中的狀態        var allNum = p.parent().find("[data-checkbox=items]").length;   //擷取所有數量的狀態        if(checkedNum == allNum){    //當被選中的數量等於總的數量時，則全選            p.parent().parent().find("[data-checkbox=all]").prop(‘indeterminate‘,false);    //去掉半選狀態，            p.parent().parent().find("[data-checkbox=all]").prop(‘checked‘,true);   //加上全選狀態        }else if((checkedNum < allNum) && (checkedNum > 0)){            p.parent().parent().find("[data-checkbox=all]").prop(‘checked‘,false);  //去掉全選狀態            p.parent().parent().find("[data-checkbox=all]").prop(‘indeterminate‘,true); //加上半選狀態        } else {            p.parent().parent().find("[data-checkbox=all]").prop(‘indeterminate‘,false);    //去掉半選狀態，            p.parent().parent().find("[data-checkbox=all]").prop(‘checked‘,false);  //去掉全選狀態        }        p.find(‘[data-checkbox=item]‘).prop(‘checked‘,this.checked);    });    $(‘[data-checkbox=item]‘).change(function(){        var p = $(this).parent().parent();        var checkedNum = p.find(‘[data-checkbox=item]:checked‘).length; //擷取被選中的狀態        var allNum = p.find(‘[data-checkbox=item]‘).length; //擷取所有數量的狀態        if(checkedNum == allNum){            p.find(‘[data-checkbox=items]‘).prop(‘indeterminate‘,false);            p.find(‘[data-checkbox=items]‘).prop(‘checked‘,true);            if(p.parent().find("[data-checkbox=items]").length == p.parent().find("[data-checkbox=items]:checked").length) {                p.parent().parent().find("[data-checkbox=all]").prop(‘indeterminate‘,false);    //去掉半選狀態，                p.parent().parent().find("[data-checkbox=all]").prop(‘checked‘,true);   //加上全選狀態            }        }else if((checkedNum < allNum) && (checkedNum > 0)){            p.find(‘[data-checkbox=items]‘).prop(‘checked‘,false);            p.find(‘[data-checkbox=items]‘).prop(‘indeterminate‘,true);            p.parent().parent().find("[data-checkbox=all]").prop(‘indeterminate‘,true);        } else {            p.find(‘[data-checkbox=items]‘).prop(‘checked‘,false);            p.find(‘[data-checkbox=items]‘).prop(‘indeterminate‘,false);            if(p.parent().find("[data-checkbox=items]:checked").length == 0) {                p.parent().parent().find("[data-checkbox=all]").prop(‘indeterminate‘,false);                p.parent().parent().find("[data-checkbox=all]").prop(‘checked‘,false);            }        }

　　

php之三態checkbox