【ztree】ztree例子

最新推荐文章于 2025-08-15 09:01:53 发布

转载最新推荐文章于 2025-08-15 09:01:53 发布 · 87 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/huxiaoyun90/p/4085318.html

文章标签：

#javascript #ViewUI

本文介绍如何利用jQuery插件zTree创建并初始化一个简单的树形结构。具体包括加载必要的JavaScript文件和CSS样式表，定义树形结构的HTML元素，并通过jQuery初始化该树形结构。文中提供了一个包含父节点及两个子节点的示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<script language="javascript" type="text/javascript" src="js/jquery.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.ztree.core-3.0.js"></script>
<link type="text/css" rel="stylesheet" href="css/zTreeStyle/zTreeStyle.css" />

<ul id="tree" class="ztree"></ul>

$(document).ready(function(){
    var Index = {
        init:function(){
            var setting = {
                treeId:'tree'
            };
            var data = [
                {id:1, pId:0, name: "父节点1"},
                {id:11, pId:1, name: "子节点1"},
                {id:12, pId:1, name: "子节点2"}
            ];
            var zTree = $.fn.zTree.init($("#tree"), setting, data); }, 
　　} 
　　$(Index.init); 
});