jquery 插件ztree的应用简单的树（tree）
首先在这分享一下 ztree 的 api 地址： http://HdhCmsTestbaby666.cn/v3/api.php 。如果本文中有些不明白的地方可以去查看 api 。
我先介绍要构建一个 tree 所需 js 文件： query-1.4.4.min.js、 query.ztree.core-3.1.js、 jquery.ztree.excheck-3.1.js 这些文件可以去网上下载。
好，有了这些 js 脚本，那么我们就要开始代码了，首先我们先来一个简单的例子，形成一个简单的 tree ，看代码如下
var setting = {
check: {
enable: true
},
data: {
simpleData: {
enable: true
}
}
};
var zNodes = [
{ id: 'root', pId:0, name:"root" },
{ id: '1', pId:'root', name:"1" },
{ id: '11', pId:'1', name:'11' },
{ id: '2', pId:'root', name:"2" },
{ id: '22', pId:'2', name:"22" }
];
$(document).ready( function (){
$.fn.zTree.init($( "#treeDemo" ), setting, zNodes);
});
上面的形成的 tree 效果是这样的
现在让我们简单解释一下 js 代码， 先来看这个行代码： $.fn.zTree.init($("#treeDemo"), setting, zNodes); 这是句话就是初始化 tree ，其中需要三个参数，参数一 $("#treeDemo") ，这是指定要把形成的 tree 现在那个 div 里，参数二 setting ，其作用是设置 tree 的一些属性，参数三 zNodes ，当然这是树所需要的节点，即是个 json 对象。
好了， 我就先 setting 这个参数，剩下其他的大家一看就明白了。 看代码
var setting = {
check: {
enable: true
},
data: {
simpleData: {
enable: true
}
}
};
其中的 check ：是设置是否要显示复选框。 Data ：是设置节点的数据模式，这里我们用的简单数据模式即 [{id:’1’,pId:’0’,name:”1”},[{id:’2’,pId:’1’,name:”2”},… 、 ] ， setting ，还有很多属性设置，大家请参看 api 我就不一一介绍了。
好了简单的 tree 形成了。
标签: ztree , jquery ztree
作者： Leo_wl
出处： http://HdhCmsTestcnblogs测试数据/Leo_wl/
本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。
版权信息查看更多关于jquery 插件ztree的应用简单的树（tree）的详细内容...