ztree--可查询

最新推荐文章于 2021-10-21 20:48:32 发布

曾_许诺

最新推荐文章于 2021-10-21 20:48:32 发布

阅读量385

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/qq_25046961/article/details/82965641

<#include "../../_include/_t.ftl"/>
<!DOCTYPE html>
<html>
<head>
<title></title>
   <#include "../../_include/_j.ftl"/>
   <#include "../../_include/_h.ftl"/>
   <#include "../../_include/_l.ftl"/>
   <#include "../../_include/_z.ftl"/>
   <#include "../../_include/work/_c.ftl"/>
</head>
<body>
    <ul id="tree" class="ztree page_tree"></ul>
<script type="text/javascript">
var setting = {
     view: {
        dblClickExpand: false,
        showLine: true,
        selectedMulti: false
     },
     data: {
        simpleData: {
          enable: true,
          idKey: "id",
          pIdKey: "pId",
          rootPId: ""
        }
     }
};
var zNodes = [
   { id: 1, pId: 0, name: "南宁市" },
   { id: 101, pId: 1, name: "青秀区" },
   { id: 102, pId: 1, name: "兴宁区" },
   { id: 103, pId: 1, name: "西乡塘区" },
   { id: 104, pId: 1, name: "江南区" },
   { id: 105, pId: 1, name: "良庆区" },
   { id: 106, pId: 1, name: "邕宁区" },
   { id: 107, pId: 1, name: "武鸣区" },
   { id: 115, pId: 1, name: "隆安县" },
   { id: 108, pId: 1, name: "马山县" },
   { id: 109, pId: 1, name: "上林县" },
   { id: 110, pId: 1, name: "宾阳县" },
   { id: 111, pId: 1, name: "横县" },
   { id: 2, pId: 0, name: "柳州市" },
   { id: 201, pId: 2, name: "柳北区" },
   { id: 206, pId: 2, name: "柳南区" },
   { id: 207, pId: 2, name: "柳江区" },
   { id: 208, pId: 2, name: "城中区" },
   { id: 202, pId: 2, name: "鱼峰区" },
   { id: 203, pId: 2, name: "鹿寨县" },
   { id: 204, pId: 2, name: "柳城县" },
   { id: 209, pId: 2, name: "融安县" },
   { id: 210, pId: 2, name: "融水苗族自治县" },
   { id: 211, pId: 2, name: "三江侗族自治县" },
   { id: 3, pId: 0, name: "桂林市", open: false },
   { id: 301, pId: 3, name: "象山区"},
   { id: 302, pId: 3, name: "秀峰区"},
   { id: 303, pId: 3, name: "叠彩区"},
   { id: 304, pId: 3, name: "七星区"},
   { id: 305, pId: 3, name: "雁山区"},
   { id: 306, pId: 3, name: "临桂区"},
   { id: 307, pId: 3, name: "阳朔县"},
   { id: 308, pId: 3, name: "灵川县"},
   { id: 309, pId: 3, name: "全州县"},
   { id: 310, pId: 3, name: "平乐县"},
   { id: 311, pId: 3, name: "兴安县"},
   { id: 312, pId: 3, name: "灌阳县"},
   { id: 313, pId: 3, name: "荔浦县"},
   { id: 314, pId: 3, name: "资源县"},
   { id: 315, pId: 3, name: "永福县"},
   { id: 316, pId: 3, name: "龙胜各族自治县"},
    { id: 317, pId: 3, name: "恭城瑶族自治县"},
    { id: 4, pId: 0, name: "梧州市", open: false },
    { id: 401, pId: 4, name: "长洲区"},
    { id: 402, pId: 4, name: "万秀区"},
    { id: 403, pId: 4, name: "龙圩区"},
    { id: 404, pId: 4, name: "岑溪市"},
    { id: 405, pId: 4, name: "苍梧县"},
    { id: 406, pId: 4, name: "蒙山县"},
   { id: 407, pId: 4, name: "藤县"},
    { id: 5, pId: 0, name: "北海市"},
    { id: 501, pId: 5, name: "海城区"},
   { id: 502, pId: 5, name: "银海区"},
   { id: 503, pId: 5, name: "铁山港区"},
   { id: 504, pId: 5, name: "合浦县"},
   { id: 6, pId: 0, name: "防城港市", open: false },
   { id: 601, pId: 6, name: "港口区"},
   { id: 602, pId: 6, name: "防城区"},
      { id: 603, pId: 6, name: "东兴市"},
   { id: 604, pId: 6, name: "上思县"},
   { id: 7, pId: 0, name: "钦州市", open: false },
   { id: 701, pId: 7, name: "钦南区"},
   { id: 702, pId: 7, name: "钦北区"},
   { id: 703, pId: 7, name: "灵山县"},
   { id: 704, pId: 7, name: "浦北县"},
   { id: 8, pId: 0, name: "贵港市", open: false },
   { id: 801, pId: 8, name: "港北区"},
   { id: 802, pId: 8, name: "港南区"},
   { id: 803, pId: 8, name: "覃塘区"},
   { id: 804, pId: 8, name: "桂平市"},
   { id: 805, pId: 8, name: "平南县"},
   { id: 9, pId: 0, name: "玉林市", open: false },
   { id: 901, pId: 9, name: "玉州区"},
   { id: 902, pId: 9, name: "福绵区"},
   { id: 903, pId: 9, name: "北流市"},
   { id: 904, pId: 9, name: "容县"},
   { id: 905, pId: 9, name: "陆川县"},
   { id: 906, pId: 9, name: "博白县"},
   { id: 907, pId: 9, name: "兴业县"},
   { id: 10, pId: 0, name: "百色市", open: false },
   { id: 1001, pId: 10, name: "右江区"},
   { id: 1002, pId: 10, name: "靖西市"},
   { id: 1003, pId: 10, name: "田阳县"},
   { id: 1004, pId: 10, name: "田东县"},
   { id: 1005, pId: 10, name: "平果县"},
   { id: 1006, pId: 10, name: "德保县"},
   { id: 1007, pId: 10, name: "那坡县"},
   { id: 1008, pId: 10, name: "凌云县"},
   { id: 1009, pId: 10, name: "乐业县"},
   { id: 1010, pId: 10, name: "田林县"},
   { id: 1011, pId: 10, name: "西林县"},
   { id: 1012, pId: 10, name: "隆林各族自治县"},
   { id: 11, pId: 0, name: "贺州市", open: false },
   { id: 1101, pId: 11, name: "八步区"},
   { id: 1102, pId: 11, name: "平桂区"},
   { id: 1103, pId: 11, name: "昭平县"},
   { id: 1104, pId: 11, name: "钟山县"},
   { id: 1105, pId: 11, name: "富川瑶族自治县"},
   { id: 12, pId: 0, name: "河池市", open: false },
   { id: 1201, pId: 12, name: "宜州区"},
   { id: 1202, pId: 12, name: "金城江区"},
   { id: 1203, pId: 12, name: "南丹县"},
   { id: 1204, pId: 12, name: "天峨县"},
   { id: 1205, pId: 12, name: "凤山县"},
   { id: 1206, pId: 12, name: "东兰县"},
   { id: 1207, pId: 12, name: "巴马瑶族自治县"},
   { id: 1208, pId: 12, name: "都安瑶族自治"},
   { id: 1209, pId: 12, name: "大化瑶族自治县"},
   { id: 1210, pId: 12, name: "罗城仫佬族自治县"},
   { id: 1211, pId: 12, name: "环江毛南族自治县"},
   { id: 13, pId: 0, name: "来宾市", open: false },
   { id: 1301, pId: 13, name: "兴宾区"},
   { id: 1302, pId: 13, name: "合山市"},
   { id: 1303, pId: 13, name: "象州县"},
   { id: 1304, pId: 13, name: "武宣县"},
   { id: 1305, pId: 13, name: "忻城县"},
   { id: 1306, pId: 13, name: "金秀瑶族自治县"},
   { id: 14, pId: 0, name: "崇左市", open: false },
   { id: 1401, pId: 14, name: "江州区"},
   { id: 1402, pId: 14, name: "凭祥市"},
   { id: 1403, pId: 14, name: "扶绥县"},
   { id: 1404, pId: 14, name: "宁明县"},
   { id: 1405, pId: 14, name: "龙州县"},
   { id: 1406, pId: 14, name: "大新县"},
   { id: 1407, pId: 14, name: "天等县"}
];
$(document).ready(function () {
   var t = $("#tree");
   t = $.fn.zTree.init(t, setting, zNodes);
});
</script>
</body>
</html>

//=========搜索框=================================================================================
<ul class="list">
        <li class="title">  <i class="layui-icon"></i> <input id="citySel" type="text" value="" onkeyup="AutoMatch(this)" style="width: 120px;" />
        </li>
    </ul>
function AutoMatch(txtObj) {
        if (txtObj.value.length > 0) {
            InitialZtree();
            var zTree = $.fn.zTree.getZTreeObj("tree");
            var nodeList = zTree.getNodesByParamFuzzy("name", txtObj.value);
            //将找到的nodelist节点更新至Ztree内
            $.fn.zTree.init($("#tree"), setting, nodeList);
            showMenu();
        } else {
            //隐藏树
            //hideMenu();
            InitialZtree();
        }
    }
    function showMenu() {
        var cityObj = $("#citySel");
        var cityOffset = $("#citySel").offset();
        //$("#menuContent").css({ left: cityOffset.left + "px", top: cityOffset.top + cityObj.outerHeight() + "px" }).slideDown("fast");
        $("#menuContent").slideDown("fast");
    }