JQuery-Ztree常见操作

目录默认打开

  • 这种需求是很常见的,页面加载完成后默认打开部分指定的目录

简单数据个数

  • 使用open参数,设置为true即可
/**简单数据格式*/
var zNodes =[
    { id:1, pId:0, name:"父节点1 - 展开", open:true,url:"jyy"},
    { id:11, pId:1, name:"父节点11 - 折叠"},
    { id:114, pId:11, name:"叶子节点114"},
    { id:12, pId:1, name:"父节点12 - 折叠"},
    { id:124, pId:12, name:"叶子节点124"},
    { id:13, pId:1, name:"父节点13 - 没有子节点", isParent:true},
    { id:2, pId:0, name:"父节点2 - 折叠"},
    { id:21, pId:2, name:"父节点21 - 展开", open:true},
    { id:211, pId:21, name:"叶子节点211"},
    { id:22, pId:2, name:"父节点22 - 折叠"},
    { id:224, pId:22, name:"叶子节点224"},
    { id:23, pId:2, name:"父节点23 - 折叠"},
    { id:234, pId:23, name:"叶子节点234"},
    { id:3, pId:0, name:"父节点3 - 没有子节点", isParent:true}
];
$(document).ready(function(){
    /**为容器初始化数据*/
    $.fn.zTree.init($("#treeDemo"), setting, zNodes);
});

标准数据格式

  • 同理使用open参数,设置为true即可
[{"name":"3.2","open":true,"children":[{"name":"asm-3.2.jar"},{"name":"asm-3.2.jar.......

单击展开/折叠节点

  • zTree 默认不提供单击展开节点的功能,但可以利用 onClick 事件回调函数轻松实现此功能
  • 为了避免与双击功能冲突,建议关闭双击展开节点的功能,请设置 setting.view.dblClickExpand = false

$(document).ready(function () {

    /** dblClickExpand: false 关闭双击展开节点
     * callback{ onClick: onClick }:回调点击事件
     * */
    var setting = {
        view: {
            dblClickExpand: false
        },
        callback: {
            onClick: onClick
        }
    };
    $.ajax({
        url: "data/fileTree.json",
        dataType: "JSON",
        success:function(data){
            console.log(data);
            var zNodes = data;
            /**
             */
            $.fn.zTree.init($("#treeDemo"), setting, zNodes);
        },
        error:function(data){
            console.log(JSON.stringify(data));
        }
    });
    /**
     * 回调方法
     * @param e
     * @param treeId
     * @param treeNode
     */
    function onClick(e,treeId, treeNode) {
        /**treeDemo值是容器的id值,不要带#*/
        var zTree = $.fn.zTree.getZTreeObj("treeDemo");
        zTree.expandNode(treeNode);
    }
});

猜你喜欢

转载自blog.csdn.net/wangmx1993328/article/details/80360085