JqueryTreeTable及示例，仿zTree绑定数据方式，亲测能用资源-CSDN文库

共12个文件

png：7个

js：3个

css：1个

Jquery,tree

5星 · 超过95%的资源需积分: 10 116 浏览量 2018-01-06 09:02:54 上传评论收藏 117KB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

JqueryTreeTable.zip （12个子文件）

JqueryTreeTable

index.html 2KB

treetable

jquery.treetable.js 17KB

images

expand.png 3KB

expand-light.png 3KB

file.png 493B

collapse.png 3KB

collapse-light.png 3KB

bg-table-thead.png 3KB

folder.png 353B

jquery.js 261KB

jquery.treetable.css 2KB

jquery-ui.js 82KB

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>jQuery treetable</title> <link rel="stylesheet" href="treetable/jquery.treetable.css" /> <script src="treetable/jquery.js"></script> <script src="treetable/jquery-ui.js"></script> <script src="treetable/jquery.treetable.js"></script> <script> $(document).ready(function(){ var heads = ["name","td1","td2"]; var tNodes = [ { id: 1, pId: 0, name: "父节点1", td: ["parent", "1"] }, { id: 11, pId: 1, name: "父节点11", td: ["<a href='javascript:void(0);' onclick=\"alert('内容为html');\">parent</a>", "11"] }, { id: 111, pId: 11, name: "叶子节点111", td: ["children", "111"] }, { id: 112, pId: 11, name: "叶子节点112", td: ["children", "112"] }, { id: 113, pId: 11, name: "叶子节点113", td: ["children", "113"] }, { id: 114, pId: 11, name: "叶子节点114", td: ["children", "114"] }, { id: 12, pId: 1, name: "父节点12", td: ["parent", "12"] }, { id: 121, pId: 12, name: "叶子节点121", td: ["children", "121"] }, { id: 122, pId: 12, name: "叶子节点122", td: ["children", "122"] }, { id: 123, pId: 12, name: "叶子节点123", td: ["children", "123"] }, { id: 124, pId: 12, name: "叶子节点124", td: ["children", "124"] }, { id: 2, pId: 0, name: "父节点2", td: ["parent", "2"] }, { id: 21, pId: 2, name: "父节点21", td: ["parent", "21"] }, { id: 211, pId: 21, name: "叶子节点211", td: ["children"] }, { id: 212, pId: 21, name: "叶子节点212", td: ["children", "212"] }, { id: 213, pId: 21, name: "叶子节点213", td: ["children", "213"] }, { id: 214, pId: 21, name: "叶子节点214", td: ["children"] } ]; $.TreeTable("treeMenu", heads, tNodes); }); </script> </head> <body> <div id="main"> <h1>jQuery treetable</h1> <a href="#" onclick="jQuery('#treeMenu').treetable('expandAll'); return false;">Expand all</a> <a href="#" onclick="jQuery('#treeMenu').treetable('collapseAll'); return false;">Collapse all</a> <table id="treeMenu" class="linetable"> </table> </div> </body> </html>

评论收藏

内容反馈