css
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>树级查询</title> <link rel="stylesheet" href="${pageContext.request.contextPath }/dtree2/layui/css/layui.css"> <script type="text/javascript" src="${pageContext.request.contextPath }/dtree2/layui/layui.js"></script> <link rel="stylesheet" href="${pageContext.request.contextPath }/dtree2/layui_ext/dtree/dtree.css"> <link rel="stylesheet" href="${pageContext.request.contextPath }/dtree2/layui_ext/dtree/font/dtreefont.css"> </head> <body> <div class="container"> <div class="layui-row layui-col-space10"> <div class="layui-fluid"> <fieldset class="layui-elem-field layui-field-title"> <legend>在线示例</legend> <div class="layui-field-box"> <div class="layui-row layui-col-space10" style="margin-top: 10px;"> <div class="layui-col-xs12"> <div id="toolbarDiv" style="overflow: auto"> <ul id="demoTree" class="dtree" data-id="0"></ul> </div> </div> </div> </div> </fieldset> </div> </div> </div> </body> <script type="text/javascript"> layui.extend({ dtree: '{/}dtree2/layui_ext/dtree/dtree' }).use(['element','layer', 'table', 'code' ,'util', 'dtree', 'form'], function(){ var element = layui.element, layer = layui.layer, table = layui.table, util = layui.util, dtree = layui.dtree, form = layui.form, $ = layui.$; { "status":{"code":200,"message":"操作成功"}, "data": [{ "id":"001", "title": "湖南省", "parentId": "0", "checkArr": [{"type": "0", "checked": "0"}], "children":[] },{ "id":"002", "title": "湖北省", "parentId": "0", "checkArr": [{"type": "0", "checked": "0"}], "children":[] },{ "id":"003", "title": "广东省", "parentId": "0", "checkArr": [{"type": "0", "checked": "0"}], "children":[] },{ "id":"004", "title": "浙江省", "parentId": "0", "checkArr": [{"type": "0", "checked": "0"}], "children":[] },{ "id":"005", "title": "福建省", "parentId": "0", "checkArr": [{"type": "0", "checked": "0"}], "children":[] }] } var DTree = dtree.render({ elem: "#demoTree", url: "detree2/json/case/checkbarTree1.json", checkbar: true, checkbarType: "all" // 默认就是all,其他的值为: no-all p-casc self only }); dtree.on("node(demoTree)", function(obj){ layer.msg(JSON.stringify(obj.param)); }) }); </script> </html>