zTree全选、全不选、目录展开、闭合自由设置

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../css/zTreeStyle/zTreeStyle.css"> 
    <script src="../js/jquery-1.4.4.min.js"></script>
    <script src="../js/jquery.ztree.all.min.js"></script>
</head>
<body>
<ul id="leftTree" class="ztree"></ul>
<a id="checkAllTrue" href="#" >全选</a>
<a id="checkAllFalse" href="#">全不选</a>
<script>
    var setting = {
        check:{
            enable:true
        },
        view: {
            showLine: true,//显示节点之间的连线。
            selectedMulti: false  //允许同时选中多个节点。
        },
        data: {
            simpleData: {
                enable:true, //使用简单数据模式
                idKey: "id",//节点数据中保存唯一标识的属性名称
                pIdKey: "pId",//节点数据中保存其父节点唯一标识的属性名称
                rootPId: "" //用于修正根节点父节点数据 默认值:null
            }
        } 
    };
    var nodes = [
        {id :"1",pId:"0",name :"父1"},
        {id :"11",pId:"1",name : "子-1"},
        {id :"111",pId:"1",name : "子-1"},
        {id :"2",pId:"0",name : "父2"},
        {id :"22",pId:"2",name: "子-2"},
        {id :"222",pId:"2",name: "子-2"},
        {id :"3",pId:"3",name: "父3"},
        {id :"33",pId:"3",name: "子-3"}
    ];
    var tree  = $.fn.zTree.init($('#leftTree'), setting, nodes);  //初始化树
    tree.expandAll(tree);  //默认展开子父目录,也可在nodes中单独用属性open:true ,选中checked:true
    function checkNode(e) {
        var zTree = $.fn.zTree.getZTreeObj("leftTree"),
                type = e.data.type,
                nodes = zTree.getSelectedNodes();
        console.log(type.indexOf("All"));
        if (type.indexOf("All") < 0 && nodes.length == 0) {
            alert("请先选择一个节点");
        }
        if (type == "checkAllTrue") {
            zTree.checkAllNodes(true);
        } else if (type == "checkAllFalse") {
            zTree.checkAllNodes(false);
        }
    }
    $("#checkAllTrue").bind("click", { type: "checkAllTrue" }, checkNode);  //全选
    $("#checkAllFalse").bind("click", { type: "checkAllFalse" }, checkNode); 选不选
    var zTreeObj = $.fn.zTree.getZTreeObj("leftTree"); //树对象
    var nodes = zTreeObj.transformToArray(zTreeObj.getNodes());
</script>
</body>
</html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值