手记

zTree多选框并获取选中节点

//引入ztree文件
<link rel="stylesheet" type="text/css" href="css/demo.css">
<link rel="stylesheet" type="text/css" href="css/zTreeStyle/zTreeStyle.css">
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/jquery.ztree.core-3.5.js"></script>
<script type="text/javascript" src="js/jquery.ztree.excheck-3.5.js"></script>
//引入jBox弹框
<link type="text/css" rel="stylesheet" href="css/Skins/Blue/jbox.css"/>
<script type="text/javascript" src="js/jquery.jBox-2.3.min.js"></script>
<script type="text/javascript" src="js/jquery.jBox-zh-CN.js"></script>

<script type="text/javascript">
    var setting = {
        data: {
            simpleData: {
                enable: true
            }
        },
        check: {
            enable: true
        }
    };

    var zNodes =[
        { id:1, pId:0, name:"随意勾选 1", open:true},
        { id:11, pId:1, name:"随意勾选 1-1"},
        { id:12, pId:1, name:"随意勾选  1-2", open:true},
        { id:121, pId:12, name:"随意勾选 1-2-1", checked:true},
        { id:122, pId:12, name:"随意勾选 1-2-2"},
        { id:123, pId:12, name:"随意勾选 1-2-3"},
        { id:13, pId:1, name:"随意勾选 1-3"},
        { id:2, pId:0, name:"随意勾选 2", open:true},
        { id:21, pId:2, name:"随意勾选 2-1"},
        { id:22, pId:2, name:"随意勾选 2-2", open:true},
        { id:221, pId:22, name:"随意勾选 2-2-1", checked:true},
        { id:222, pId:22, name:"随意勾选 2-2-2"},
        { id:223, pId:22, name:"随意勾选 2-2-3"},
        { id:23, pId:2, name:"随意勾选 2-3", checked:true}
    ];

    $(document).ready(function(){
        $.fn.zTree.init($("#baseTree"), setting, zNodes);
    });
    function findChecked() {
        var treeObj = $.fn.zTree.getZTreeObj("baseTree");
        var ids=[];
        var nodes = treeObj.getCheckedNodes(true);
        for(var i=0;i<nodes.length;i++)
         {
             ids.push(nodes[i].name+"<br>");
         }
        $.jBox.info(ids);
    }

</script>
0人推荐
随时随地看视频
慕课网APP