springboot thymeleaf和jquery zTree 插件的简单demo

学习springboot  和前端插件ztree的学习笔记，记录备忘：

1、引入css和js，这里的/目录对应src/main/resources/static目录
<link rel="stylesheet" type="text/css" th:href="@{/zTreeStyle.css}">
<script type="text/javascript" src="/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="/jquery.ztree.all.js"></script>

2、添加如下 HTML 代码

<div>
   <ul id="treeDemo" class="ztree"></ul>
</div>

3、第三步：初始化zTree

function zTreeOnRightClick(event, treeId, treeNode) {
    alert(treeNode ? treeNode.tId + ", " + treeNode.name : "isRoot");
};

var zTreeObj;
//此处定义鼠标右键方法
var setting = {
    callback: {
        onRightClick: zTreeOnRightClick
    }
};
//此处定义节点信息及鼠标左键方法
var zNodes = [
{name:"test1", 
    open:true, "click":"alert('test');",children:[
   {name:"test1_1"}, {name:"test1_2"}]},
{name:"test2", open:true, children:[
   {name:"test2_1"}, {name:"test2_2"}]}
];

$(document).ready(function(){
   zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, zNodes);
});