使用jstree从后台获取数据在前台进行树状菜单展示（树状菜单 JsTree）

1.css和js下载地址：https://www.jstree.com

2.把这几个文件拷贝到项目中

3.页面引用，把css和js引到页面中

然后写个标签，用来存放你的树状菜单：

<div id="myJstree"></div>

4.开始写个js，从后台获取数据，然后进行展示；

tzs = {};
tzs.index = {
    //初始化页面
    init: function () {
        tzs.index.doCreateTree();
    },
   //给标签绑定事件
   event : function(){
   },
    doCreateTree : function(){
       $.getJSON("/user/queryJsTree",function(rs){
           $('#myJstree').jstree({
                "core" : {
                    "mutiple" : false,
                    "check_callback" : true,
                    "data" : rs.data
                }
            });
        });

        //树节点左键相应函数（监听）
       $('#myJstree').on("select_node.jstree",function (node,selected,event) {
           //当前点击的对象的id
            alert(selected.node.id);
        })
    }
};

$(function(){
    tzs.index.init();
});

5.获取数据的接口写法如下：

注意：返回数据的对象需要有id，parent，text属性，用来区分他们的父亲是谁，我的jstreeVO是这样定义的：

5.页面展示效果如下：

starry.每天进步一点点❤