jquery+zui 实现 复选框树

做毕设遇到一处需要复选框树，觉得easyui略丑，而zui又没有复选框树，只有树形菜单，遂自己撸！

效果图

树形结构用了zui的树形菜单，然后自己添加复选框，自己写复选框级联，是一个递归。（所以好好学习算法数据结构～）
代码如下

  

    水果
    

      
苹果
      

        热带水果
        

          ...
        
      
      
梨子
      ...
    
  
  
粥饭
  ...

这边是zui官网的demo，然后自己加了checkbox。
下面是实现复选框级联的代码：

// 监听复选框
 $('#tree [type="checkbox"]').change(function () {
        if($(this).is(":checked")) {
            // 如果变为已选，则将其子复选框全部变成已选
            $(this).parent().find(':checkbox').prop("checked", true);
        } else {
            // 如果变为未选，则将其子复选框全部变成未选
            $(this).parent().find(':checkbox').prop("checked", false);
            
        }
        reloadExamineeTree();
    });

    // 更新整个复选框，实现级联
    function reloadExamineeTree(){
        // 遍历几个根复选框
        $('#tree ').children('li').each(function(){
            setChecked($(this).children('input')[0])
        });
    }

    // 递归设置每一个非叶子复选框的状态
    function setChecked(dom) {
        if($(dom).next().next().find(':checkbox').length==0){
            //console.log(dom);
            return $(dom).is(':checked')?1:0;
        } else {
            var sum=0;
            $(dom).next().next().children().each(function () {
                sum += setChecked($(this).children('input')[0]);
            });
            if(sum == $(dom).next().next().children().length){
                $(dom).prop('checked', true);
            }else {
                $(dom).prop('checked', false);

            }
            //console.log(sum);
            return $(dom).is(':checked')?1:0;

        }
    }