关于javascript:zTree-jQuery-树插件

12次阅读

共计 886 个字符，预计需要花费 3 分钟才能阅读完成。

参考 http://www.treejs.cn

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!-- 引入 css-->

    <link rel="stylesheet" href="bower_components/layer/skin/default/layer.css">
    <link rel="stylesheet" href="bower_components/ztree/css/metroStyle/metroStyle.css"/>
</head>
<body>
<div>
    <ul id="treeDemo" class="ztree"></ul>
</div>
<!-- 引入 js-->
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script type="text/javascript" src="bower_components/ztree/jquery.ztree.all.min.js"></script>
<script type="text/javascript" src="bower_components/layer/layer.js">
</script>
<script>
    // 简略 ztree 配置
    var setting = {
        data: {
            simpleData: {
                enable: true,
                idKey: "id",
                pIdKey: "parentId",
                rootPId: 0
            }
        }
    }
    $.ajax({
        url: "/menu/doFindZtreeMenuNodes",
        success: function (result) {// 初始化 zTree( 参考 http://www.treejs.cn/)
            // 基于 setting 配置将返回的数据在 treeDemo 地位进行出现
            $.fn.zTree.init($("#treeDemo"), setting, result.data);
        }
    })

</script>
</body>
</html>

正文完