@{ Layout = null; Layout = "~/Views/Shared/_Layout.cshtml"; } <link href="/Content/Scripts/tools/ztree/demo.css" rel="stylesheet" /> <link href="/Content/Scripts/tools/ztree/zTreeStyle/zTreeStyle.css" rel="stylesheet" /> <!-- Start #content --> <div id="content" > <!-- Start .content-wrapper --> <div class="content-wrapper"> <div id="page-heading" class="page-header"> <h2><i class="icon im-file7"></i> 模块列表</h2> </div> <!-- Start .content-inner --> <div class="content-inner"> <!-- Start .row --> <div class="row"> <ul id="treeDemo" class="ztree"></ul> </div> <!-- End .row --> </div> <!-- End .content-inner --> </div> <!-- End .content-wrapper --> <div class="clearfix"></div> </div> <!-- End #content --> @section scripts{ <script src="/Content/Scripts/tools/ztree/jquery.ztree.core-3.5.js" type="text/javascript"></script> <script type="text/javascript"> var setting = {}; var zNodes = [ { name: "父节点1 - 展开", open: true, children: [ { name: "父节点11 - 折叠", children: [ { name: "叶子节点111" }, { name: "叶子节点112" }, { name: "叶子节点113" }, { name: "叶子节点114" } ] }, { name: "父节点12 - 折叠", children: [ { name: "叶子节点121" }, { name: "叶子节点122" }, { name: "叶子节点123" }, { name: "叶子节点124" } ] }, { name: "父节点13 - 没有子节点", isParent: true } ] }, { name: "父节点2 - 折叠", children: [ { name: "父节点21 - 展开", open: true, children: [ { name: "叶子节点211" }, { name: "叶子节点212" }, { name: "叶子节点213" }, { name: "叶子节点214" } ] }, { name: "父节点22 - 折叠", children: [ { name: "叶子节点221" }, { name: "叶子节点222" }, { name: "叶子节点223" }, { name: "叶子节点224" } ] }, { name: "父节点23 - 折叠", children: [ { name: "叶子节点231" }, { name: "叶子节点232" }, { name: "叶子节点233" }, { name: "叶子节点234" } ] } ] }, { name: "父节点3 - 没有子节点", isParent: true } ]; $(document).ready(function () { $.fn.zTree.init($("#treeDemo"), setting, zNodes); }); </script> }