Ztree-Demo

工作用到得记录方便以后使用,选择它的原因是节点可以任意形式打开或者关闭,如点击父节点,子孙节点可以跟着选择或者可以不选择,通过chkboxType来控制。

<!DOCTYPE html>
<html lang="en">

<head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <!-- <link rel="stylesheet" href="../../../../src/utils/ztree/css/demo.css" type="text/css"> -->
        <link rel="stylesheet" href="../../../../src/utils/ztree/css/zTreeStyle/zTreeStyle.css" type="text/css">
        <link href="../../../../src/style/bootstrap.min.css" rel="stylesheet">
        <link href="../../../../src/style/bootstrap-theme.min.css" rel="stylesheet">
        <link href="../../../../src/style/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen">
        <link href="../../../../src/style/index.css" rel="stylesheet">
        <link href="../../../../src/style/reset.css" rel="stylesheet">
       
        <style>
ul.ztree {margin-top: 10px;border: 1px solid #617775;background: #f0f6e4;250px;height:460px;overflow-y:scroll;overflow-x:auto;}
div.zTreeDemoBackground {280px;height:462px;text-align:left;}
            </style>
    <script>
        
    </script>
</head>

<body>
    <div class="main">
        <div class="public-container">
            <form class="form-inline">
                <div class="alert alert-info" style="height: 30px;line-height: 10px;" role="alert">Edit Page</div>
                <div class="office-row clearfix">
                    <div class="office-col">
                            <div class="form-group">
                                    <!-- <label for="Role" class="label_width_100">Role</label> -->
                                    <label for="Role" class="label_width_100">Role</label>
                                    <select class="form-control input_width_196" id="Role">
                                            <option>Insurance Regulatory Commission</option>
                                            <option>Insurance Regulatory Bureau</option>
                                            <option>Insurance Industry Association</option>
                                            <option>Insurance Company</option>
                                            <option>Insurance Intermediary Company</option>
                                            <option>Practitioner</option>
                                    </select>
                                </div>
                    </div>
                    <div class="office-col">
                            <!-- <label for="Remark" class="label_width_100">Remark</label> -->
                            <label for="Remark" class="label_width_100">Remarks</label>
                            <input type="text" class="form-control" id="Remark" placeholder="Remark">
                    </div>
                </div>
                <div class="test">
                        <div class="office-row">
                            <div class="form-group">
                                    <!-- <label for="idNo" class="office-col-4">Menu</label> -->
                                    <label for="idNo" class="office-col-4">Menu</label>
                                    <div class="office-col-4">
                                        <ul id="treeDemo" class="ztree"></ul>
                                    </div>
                            </div>
                        </div>
                    </div>
                
            </form>
            <!-- <button id="Cancel" type="button" class="btn btn-primary ">Cancel</button>
            <button id="Submit" type="submit" class="btn btn-default ">Submit</button> -->
            <button id="Cancel" type="button" class="btn btn-primary ">Cancel</button>
            <button id="Submit" type="submit" class="btn btn-default ">Submit</button>
        </div>
    </div>
    <script src="../../../../src/utils/jquery.js"></script>
    <script src="../../../../src/utils/bootstrap.min.js"></script>
    <script src="../../../../src/utils/bootstrap-datetimepicker.min.js" charset="UTF-8"></script>
    <script type="text/javascript" src="../../../../src/utils/ztree/js/jquery-1.4.4.min.js"></script>
    <script type="text/javascript" src="../../../../src/utils/ztree/js/jquery.ztree.core.js"></script>
    <script type="text/javascript" src="../../../../src/utils/ztree/js/jquery.ztree.excheck.js"></script>
<!--<script type="text/javascript" src="./ztree/js/jquery.ztree.exedit.js"></script>-->
    <script type="text/javascript" src="../../../../src/utils/ztree/js/jquery.ztree.exhide.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            // $(document).ready(function () {
        //     $('.form_date').datetimepicker({
        //         // language: 'fr',
        //         format:'dd/mm/yyyy', // 格式 
        //         weekStart: 1, // 一周从那天开始(0(星期日)-6)
        //         autoclose: 1,
        //         todayHighlight: 1, // 高亮当前日期
        //         minView: 2,
        //         forceParse: 0
        //     });
        // });
        var setting = {
            check: {
                enable: true
            },
            data: {
                key: {
                    title: "title"
                },
                simpleData: {
                    enable: true
                }
            },
            callback: {
                onCheck: onCheck
            },
            check: {
            enable: true,
            chkboxType:{
                "Y" : "ps",
                "N" : "ps"
            }
        },
        };

        var zNodes =[
            // { id:1, pId:0, name:"父节点1", title:"", checked:true, open:true},
            // { id:11, pId:1, name:"父节点11", title:"", checked:true, open:true},
            // { id:111, pId:11, name:"叶子节点111", title:"", checked:true, isHidden:true},
            // { id:112, pId:11, name:"叶子节点112", title:""},
            // { id:113, pId:11, name:"叶子节点113", title:""},
            // { id:12, pId:1, name:"父节点12", title:"", isHidden:true, open:true},
            // { id:121, pId:12, name:"叶子节点121", title:""},
            // { id:122, pId:12, name:"叶子节点122", title:"", isHidden:true},
            // { id:123, pId:12, name:"叶子节点123", title:""},
            /*            查询平台         */
            { id:1, pId:0, name:"Query Platform", title:"", open:false},
            { id:11, pId:1, name:"Insurance Intermediary Employees Query", title:"", open:true},
            { id:111, pId:11, name:"Query", title:""},
            { id:12, pId:1, name:"Insurance Assessment Qualification Certificate Query", title:"", open:true},
            { id:121, pId:12, name:"Query", title:""},
            { id:122, pId:12, name:"Certificate Coding Rules", title:""},
            { id:13, pId:1, name:"Insurance Professional Intermediary Query", title:"", open:true},
            { id:131, pId:13, name:"Query", title:""},
            { id:14, pId:1, name:"Insurance Concurrent Agency Query", title:"", open:true},
            { id:141, pId:14, name:"Query", title:""},
            { id:15, pId:1, name:"Contact Information Query Of Insurance Industry Association", title:"", open:true},
            { id:151, pId:15, name:"Query", title:""},
            { id:16, pId:1, name:"Life Insurance Recorded Product Catalog Query", title:"", open:true},
            { id:161, pId:16, name:"Query", title:""},
            { id:17, pId:1, name:"Property Insurance Recorded Product Catalog Query", title:"", open:true},
            { id:171, pId:17, name:"Query", title:""},
            { id:18, pId:1, name:"Commercial Vehicle Insurance Model Clause And Rate Benchmark Query", title:"", open:true},
            { id:181, pId:18, name:"Motor Vehicle And Special Vehicle Damage Insurance", title:"", open:true},
            { id:1811, pId:181, name:"Query", title:""},
            { id:182, pId:18, name:"Damage Insurance For Motorcycle, Tractor And Single Lift Vehicle", title:"", open:true},
            { id:1821, pId:182, name:"Query", title:""},
            { id:183, pId:18, name:"Third Party Liability Insurance, Vehicle Personnel Liability Insurance, Whole Vehicle Theft Rescue", title:"", open:true},
            { id:1831, pId:183, name:"Query", title:""},
            { id:184, pId:18, name:"No Compensation Preferential Treatment For Motor Vehicles And Special Vehicles And Adjustment Coefficient Of Last Year'S Compensation Record Rate", title:""},
            { id:185, pId:18, name:"Query On The Floating Scheme Of Traffic Illegal Coefficient Of Commercial Vehicle Insurance", title:""},
            { id:186, pId:18, name:"Absolute Deductible Coefficient Of Commercial Insurance Demonstration Products For Motor Vehicles And Special Vehicles", title:""},

            /*系统管理*/
            { id:2, pId:0, name:"System Management", title:"", open:false},
            { id:21, pId:2, name:"User Management", title:"",  open:true},
            { id:210, pId:21, name:"Query", title:""},
            { id:211, pId:21, name:"Add", title:""},
            { id:212, pId:21, name:"Delete", title:""},
            { id:213, pId:21, name:"Edit", title:""},
            { id:22, pId:2, name:"Role Management", title:"", open:true},
            { id:220, pId:22, name:"Query", title:""},
            { id:221, pId:22, name:"Add", title:""},
            { id:222, pId:22, name:"Delete", title:""},
            { id:223, pId:22, name:"Edit", title:""},
            { id:23, pId:2, name:"Menu Management", title:"", open:true},
            { id:230, pId:23, name:"Query", title:""},
            { id:231, pId:23, name:"Add", title:""},
            { id:232, pId:23, name:"Delete", title:""},
            { id:233, pId:23, name:"Edit", title:""},
            { id:24, pId:2, name:"Access Management", title:"", open:true},

            /*人员监管*/
            { id:3, pId:0, name:"Personnel Supervision", title:"", open:false},
            { id:31, pId:3, name:"Examination Management", title:"",  open:true},
            { id:310, pId:31, name:"Examination Result Entry", title:"", open:true},
            { id:3101, pId:310, name:"Query", title:""},
            { id:3102, pId:310, name:"Add", title:""},
            { id:3103, pId:310, name:"Edit", title:""},
            { id:3104, pId:310, name:"Import", title:""},
            { id:3105, pId:310, name:"Delete", title:""},
            { id:311, pId:31, name:"Examination Result Review", title:"", open:true},
            { id:3111, pId:311, name:"Query", title:""},
            { id:3112, pId:311, name:"Verify", title:""},
            { id:32, pId:3, name:"Certificate Management", title:"",  open:true},
            { id:320, pId:32, name:"Generate Certificate", title:"", open:true},
            { id:3201, pId:320, name:"Query", title:""},
            { id:3202, pId:320, name:"Generate Certificate No.", title:""},
            { id:321, pId:32, name:"Certificate Change Application", title:"", open:true},
            { id:3211, pId:321, name:"Query", title:""},
            { id:3212, pId:321, name:"Change Application", title:""},
            { id:322, pId:32, name:"Certificate Change Review", title:"", open:true},
            { id:3221, pId:322, name:"Query", title:""},
            { id:3222, pId:322, name:"Verify", title:""},
            { id:323, pId:32, name:"Print Certificate", title:"", open:true},
            { id:3231, pId:323, name:"Query", title:""},
            { id:3232, pId:323, name:"Printing", title:""},
            { id:33, pId:3, name:"Business License Management", title:"",  open:true},
            { id:330, pId:33, name:"Sales Registration", title:"", open:true},
            { id:3301, pId:330, name:"Query", title:""},
            { id:3302, pId:330, name:"Add", title:""},
            { id:3303, pId:330, name:"Edit", title:""},
            { id:3304, pId:330, name:"Verify", title:""},
            { id:331, pId:33, name:"Business License Generation", title:"", open:true},
            { id:3311, pId:331, name:"Query", title:""},
            { id:3312, pId:331, name:"Generate Business License", title:""},
            { id:3313, pId:331, name:"Print Business License", title:""},
            { id:332, pId:33, name:"Business License Change", title:"", open:true},
            { id:3321, pId:332, name:"Query", title:""},
            { id:3322, pId:332, name:"Change Application", title:""},
            { id:333, pId:33, name:"Business License Change Verification", title:"", open:true},
            { id:3331, pId:333, name:"Query", title:""},
            { id:3332, pId:333, name:"Verify", title:""},
            { id:334, pId:33, name:"Exhibition License Annual Examination ", title:"", open:true},
            { id:3341, pId:334, name:"Query", title:""},
            { id:3342, pId:334, name:"Verify", title:""},
            { id:34, pId:3, name:"Training Management", title:"",  open:true},
            { id:340, pId:34, name:"Training Organization Management", title:"", open:true},
            { id:3401, pId:340, name:"Query", title:""},
            { id:3402, pId:340, name:"Add", title:""},
            { id:3403, pId:340, name:"Edit", title:""},
            { id:3404, pId:340, name:"Verify", title:""},
            { id:341, pId:34, name:"Marketing Training Management", title:"", open:true},
            { id:3411, pId:341, name:"Query", title:""},
            { id:3412, pId:341, name:"Add", title:""},
            { id:3413, pId:341, name:"Edit", title:""},
            { id:3414, pId:341, name:"Verify", title:""},
            { id:342, pId:34, name:"Comprehensive Query", title:"", open:true},
            { id:3421, pId:342, name:"Query", title:""},
            { id:35, pId:3, name:"Integrity Management", title:"",  open:true},
            { id:350, pId:35, name:"Compliment Management", title:"", open:true},
            { id:3501, pId:350, name:"Query", title:""},
            { id:3502, pId:350, name:"Add", title:""},
            { id:3503, pId:350, name:"Edit", title:""},
            { id:3504, pId:350, name:"Delete", title:""},
            { id:351, pId:35, name:"Complaint Management", title:"", open:true},
            { id:3511, pId:351, name:"Query", title:""},
            { id:3512, pId:351, name:"Add", title:""},
            { id:3513, pId:351, name:"Edit", title:""},
            { id:3514, pId:351, name:"Delete", title:""},
            { id:352, pId:35, name:"Violation Management", title:"", open:true},
            { id:3521, pId:352, name:"Query", title:""},
            { id:3522, pId:352, name:"Add", title:""},
            { id:3523, pId:352, name:"Edit", title:""},
            { id:3524, pId:352, name:"Delete", title:""},
            { id:353, pId:35, name:"Scoring Management", title:"", open:true},
            { id:3531, pId:353, name:"Query", title:""},
            { id:3532, pId:353, name:"Add", title:""},
            { id:354, pId:35, name:"Comprehensive Query", title:"", open:true},
            { id:3541, pId:354, name:"Query", title:""},
            
            /*机构监管*/
            { id:4, pId:0, name:"Institutional Supervision", title:"", open:false},
            { id:41, pId:4, name:"Organizational Management", title:"",  open:true},
            { id:410, pId:41, name:"Qualification Management", title:"", open:true},
            { id:4101, pId:410, name:"Institutional Admittance", title:"", open:true},
            { id:41011, pId:4101, name:"Query", title:""},
            { id:41012, pId:4101, name:"Legal Entity Application", title:""},
            { id:41013, pId:4101, name:"Branch Application", title:""},
            { id:41014, pId:4101, name:"Verify", title:""},
            { id:4102, pId:410, name:"Item Change", title:"", open:true},
            { id:41021, pId:4102, name:"Query", title:""},
            { id:41022, pId:4102, name:"Registered Capital Change", title:""},
            { id:41023, pId:4102, name:"Organization Change", title:""},
            { id:41024, pId:4102, name:"Use Security Deposit", title:""},
            { id:41025, pId:4102, name:"Company Name Change", title:""},
            { id:41026, pId:4102, name:"Address Change", title:""},
            { id:41027, pId:4102, name:"Association Regulation Change", title:""},
            { id:41028, pId:4102, name:"Investor Name Change", title:""},
            { id:41029, pId:4102, name:"Verify", title:""},
            { id:4103, pId:410, name:"Qualification Extension", title:"", open:true},
            { id:41031, pId:4103, name:"Query", title:""},
            { id:41032, pId:4103, name:"Certificate Renewal Application", title:""},
            { id:41033, pId:4103, name:"Verify", title:""},
            { id:4104, pId:410, name:"Institutional Exit", title:"", open:true},
            { id:41041, pId:4104, name:"Query", title:""},
            { id:41042, pId:4104, name:"Legal Entity Exit", title:""},
            { id:41023, pId:4104, name:"Branch Exit", title:""},
            { id:41024, pId:4104, name:"Verify", title:""},
            { id:411, pId:41, name:"Practice Behavior Management ", title:"", open:true},
            { id:4111, pId:411, name:"Supervision Fee", title:"", open:true},
            { id:41112, pId:4111, name:"Query", title:""},
            { id:41113, pId:4111, name:"Invoice Registration Information", title:""},
            { id:41114, pId:4111, name:"Payment Registration Information", title:""},
            { id:41115, pId:4111, name:"Clearing Registration Information", title:""},
            { id:41116, pId:4111, name:"Verify", title:""},
            { id:4112, pId:411, name:"Deposite", title:"", open:true},
            { id:41122, pId:4112, name:"Query", title:""},
            { id:41123, pId:4112, name:"Add", title:""},
            { id:41124, pId:4112, name:"Edit", title:""},
            { id:41125, pId:4112, name:"Delete", title:""},
            { id:41126, pId:4112, name:"Verify", title:""},
            { id:4113, pId:411, name:"Liability Insurance", title:"", open:true},
            { id:41132, pId:4113, name:"Query", title:""},
            { id:41133, pId:4113, name:"Add", title:""},
            { id:41134, pId:4113, name:"Edit", title:""},
            { id:41135, pId:4113, name:"Delete", title:""},
            { id:41136, pId:4113, name:"Verify", title:""},
            { id:4114, pId:411, name:"External Audit", title:"", open:true},
            { id:41141, pId:4114, name:"Query", title:""},
            { id:41142, pId:4114, name:"Add", title:""},
            { id:41143, pId:4114, name:"Edit", title:""},
            { id:41144, pId:4114, name:"Delete", title:""},
            { id:41145, pId:4114, name:"Verify", title:""},
            { id:41156, pId:411, name:"Agency Relationship", title:"", open:true},
            { id:41151, pId:41156, name:"Query", title:""},
            { id:41152, pId:41156, name:"Add", title:""},
            { id:41153, pId:41156, name:"Edit", title:""},
            { id:41154, pId:41156, name:"Delete", title:""},
            { id:41155, pId:41156, name:"Verify", title:""},
            { id:412, pId:41, name:"Operation Staff Management", title:"", open:true},
            { id:4121, pId:412, name:"Operation Staff ", title:"", open:true},
            { id:41211, pId:4121, name:"Query", title:""},
            { id:41212, pId:4121, name:"Add", title:""},
            { id:41213, pId:4121, name:"Edit", title:""},
            { id:41214, pId:4121, name:"Delete", title:""},
            { id:41215, pId:4121, name:"Verify", title:""},
            { id:413, pId:41, name:"Product Management", title:"", open:true},
            { id:4131, pId:413, name:"Product Registration", title:"", open:true},
            { id:41311, pId:4131, name:"Query", title:""},
            { id:41312, pId:4131, name:"Add", title:""},
            { id:41313, pId:4131, name:"Edit", title:""},
            { id:41314, pId:4131, name:"Delete", title:""},
            { id:41315, pId:4131, name:"Verify", title:""},
            { id:42, pId:4, name:"Executive Management", title:"", open:true},
            { id:421, pId:42, name:"Qualification Approval Management", title:"", open:true},
            { id:4211, pId:421, name:"Query", title:""},
            { id:4212, pId:421, name:"Add", title:""},
            { id:4213, pId:421, name:"Edit", title:""},
            { id:4215, pId:421, name:"Verify", title:""},
            { id:422, pId:42, name:"Qualification Report Management", title:"", open:true},
            { id:4221, pId:422, name:"Query", title:""},
            { id:4222, pId:422, name:"New Appointment", title:""},
            { id:4223, pId:422, name:"Job Mobility", title:""},
            { id:4224, pId:422, name:"Offboard", title:""},
            { id:4225, pId:422, name:"Verify", title:""},

            /*非现场监管*/
            { id:5, pId:0, name:"Off Site Supervision", title:"", open:false},
            { id:51, pId:5, name:"Reporting Management", title:"",  open:true},
            { id:510, pId:51, name:"Report Entry", title:"", open:true},
            { id:511, pId:51, name:"Reporting Management", title:"", open:true},
            { id:5111, pId:511, name:"Query", title:""},
            { id:5112, pId:511, name:"Check", title:""},
            { id:5113, pId:511, name:"Report", title:""},
            { id:512, pId:51, name:"Report Query", title:"", open:true},
            { id:5121, pId:512, name:"Query", title:""},
            { id:513, pId:51, name:"Organization Summary Query", title:"", open:true},
            { id:5131, pId:513, name:"Query", title:""},
            { id:52, pId:5, name:"Market Analysis", title:"",  open:true},
            { id:521, pId:52, name:"Query", title:""},
            { id:522, pId:52, name:"Report Analysis", title:""},
            { id:53, pId:5, name:"Risk Analysis", title:"",  open:true},
            { id:530, pId:53, name:"Risk Indicator Setting", title:"", open:true},
            { id:5301, pId:530, name:"Query", title:""},
            { id:5302, pId:530, name:"Risk Indicators", title:""},
            { id:531, pId:53, name:"Risk Analysis", title:"", open:true},
            { id:5311, pId:531, name:"Query", title:""},
            { id:5312, pId:531, name:"Report Analysis", title:""},
            { id:54, pId:5, name:"Subject and Report Design", title:"",  open:true},
            { id:541, pId:54, name:"Query", title:""},
            { id:542, pId:54, name:"Add", title:""},
            { id:543, pId:54, name:"Edit Report", title:""},
            { id:544, pId:54, name:"Editl Subject", title:""},
            { id:545, pId:54, name:"Delete", title:""},

            /*行政许可*/
            { id:6, pId:0, name:"Administrative Licensing", title:"", open:false},
            { id:60, pId:6, name:"Administrative Licensing Guidelines", title:"",  open:true},
            { id:601, pId:60, name:"Business Guide", title:""},
            { id:601, pId:60, name:"Online Application", title:""},
            { id:601, pId:60, name:"Work Flow", title:""},
            { id:61, pId:6, name:"Online Application", title:"",  open:true},
            { id:611, pId:61, name:"Application", title:"",  open:true},
            { id:6111, pId:611, name:"Online Application", title:"",  open:true},
            { id:612, pId:61, name:"User Initialization", title:"",  open:true},
            { id:6121, pId:612, name:"Submit", title:""},
            { id:613, pId:61, name:"Insurance Organization", title:"",  open:true},
            { id:6131, pId:613, name:"Application For Establishment Of Legal Entity", title:"",  open:true},
            { id:61311, pId:6131, name:"Submit", title:""},
            { id:6132, pId:613, name:"Application For Opening Of Legal Entity", title:"",  open:true},
            { id:61321, pId:6132, name:"Submit", title:""},
            { id:6133, pId:613, name:"Material Correction", title:"",  open:true},
            { id:61331, pId:6133, name:"Submit", title:""},
            { id:614, pId:61, name:"Insurance Intermediary", title:"",  open:true},
            { id:6141, pId:614, name:"Application For Establishment Of Intermediary", title:"",  open:true},
            { id:61411, pId:6141, name:"Submit", title:""},
            { id:6142, pId:614, name:"Qualification Approval Of Management Personnel", title:"",  open:true},
            { id:61421, pId:6142, name:"Submit", title:""},
            { id:6143, pId:614, name:"Material Correction", title:"",  open:true},
            { id:61431, pId:6143, name:"Submit", title:""},
            { id:615, pId:61, name:"Foreign Insurance Organization Representative Office", title:"",  open:true},
            { id:6151, pId:615, name:"Application For Establishment Of Representative Office", title:"",  open:true},
            { id:61511, pId:6151, name:"Submit", title:""},
            { id:6152, pId:615, name:"Name Change Application", title:"",  open:true},
            { id:61521, pId:6152, name:"Submit", title:""},
            { id:6153, pId:615, name:"Application For Change Of Chief Representative", title:"",  open:true},
            { id:61531, pId:6153, name:"Submit", title:""},
            { id:6154, pId:615, name:"Material Correction", title:"",  open:true},
            { id:61541, pId:6154, name:"Submit", title:""},
            { id:62, pId:6, name:"Query Results", title:"",  open:true},
            { id:63, pId:6, name:"Results Release", title:"",  open:true},




        ];

        function onCheck(e, treeId, treeNode) {
            count();
        }

        function setTitle(node) {
            var zTree = $.fn.zTree.getZTreeObj("treeDemo");
            var nodes = node ? [node]:zTree.transformToArray(zTree.getNodes());
            for (var i=0, l=nodes.length; i<l; i++) {
                var n = nodes[i];
                n.title = "[" + n.id + "] isFirstNode = " + n.isFirstNode + ", isLastNode = " + n.isLastNode;
                zTree.updateNode(n);
            }
        }
        function count() {
            function isForceHidden(node) {
                if (!node.parentTId) return false;
                var p = node.getParentNode();
                return !!p.isHidden ? true : isForceHidden(p);
            }
            var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
            checkCount = zTree.getCheckedNodes(true).length,
            nocheckCount = zTree.getCheckedNodes(false).length,
            hiddenNodes = zTree.getNodesByParam("isHidden", true),
            hiddenCount = hiddenNodes.length;

            for (var i=0, j=hiddenNodes.length; i<j; i++) {
                var n = hiddenNodes[i];
                if (isForceHidden(n)) {
                    hiddenCount -= 1;
                } else if (n.isParent) {
                    hiddenCount += zTree.transformToArray(n.children).length;
                }
            }

            $("#isHiddenCount").text(hiddenNodes.length);
            $("#hiddenCount").text(hiddenCount);
            $("#checkCount").text(checkCount);
            $("#nocheckCount").text(nocheckCount);
        }
        function showNodes() {
            var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
            nodes = zTree.getNodesByParam("isHidden", true);
            zTree.showNodes(nodes);
            setTitle();
            count();
        }
        function hideNodes() {
            var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
            nodes = zTree.getSelectedNodes();
            if (nodes.length == 0) {
                alert("请至少选择一个节点");
                return;
            }
            zTree.hideNodes(nodes);
            setTitle();
            count();
        }

        $(document).ready(function(){
            $.fn.zTree.init($("#treeDemo"), setting, zNodes);
            $("#hideNodesBtn").bind("click", {type:"rename"}, hideNodes);
            $("#showNodesBtn").bind("click", {type:"icon"}, showNodes);
            setTitle();
            count();
        });
        });
    </script>
</body>
</html>
原文地址:https://www.cnblogs.com/TimeSay/p/12394251.html