treedemo实现复选框

<!DOCTYPE html> <html> <head>     <title>ZTREE DEMO - Standard Data </title>     <meta http-equiv="content-type" content="text/html; charset=UTF-8">     <link rel="stylesheet" href="css/zTreeStyle/zTreeStyle.css" type="text/css">     <link rel="stylesheet" href="css/demo.css" type="text/css">     <script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>     <script type="text/javascript" src="js/jquery.ztree.core-3.4.js"></script>     <script type="text/javascript" src="js/jquery.ztree.excheck-3.4.js"></script>     <!--       <script type="text/javascript" src="js/jquery.ztree.exedit-3.4.js"></script>-->     <script type="text/javascript">         <!--         var setting = {             check: {                 enable: true             },             /*data: {             simpleData: {             enable: true             }             }*/             data: {                 simpleData: {                     enable: true                 }             },             callback: {                 onCheck: onCheck             }

        };

        var zNodes = [             { id: 1, pId: 0, name: "随意勾选 1", open: false },             { id: 11, pId: 1, name: "随意勾选 1-1", open: true },             { id: 111, pId: 11, name: "随意勾选 1-1-1" },             { id: 112, pId: 11, name: "随意勾选 1-1-2" },             { id: 12, pId: 1, name: "随意勾选 1-2", open: true },             { id: 121, pId: 12, name: "随意勾选 1-2-1" },             { id: 122, pId: 12, name: "随意勾选 1-2-2" },             { id: 2, pId: 0, name: "随意勾选 2", open: false },             { id: 21, pId: 2, name: "随意勾选 2-1" },             { id: 22, pId: 2, name: "随意勾选 2-2", open: true },             { id: 221, pId: 22, name: "随意勾选 2-2-1" },             { id: 222, pId: 22, name: "随意勾选 2-2-2" },             { id: 23, pId: 2, name: "随意勾选 2-13" }         ];

        $(document).ready(function () {             $.fn.zTree.init($("#treeDemo"), setting, zNodes);         });

        function onCheck(e, treeId, treeNode) {             var treeObj = $.fn.zTree.getZTreeObj("treeDemo"),             nodes = treeObj.getCheckedNodes(true),             v = "";             for (var i = 0; i < nodes.length; i++) {                 v += nodes[i].name + ",";                 alert(nodes[i].id); //获取选中节点的值             }

        }                     //-->     </script> </head> <body>     <div class="zTreeDemoBackground left">         <ul id="treeDemo" class="ztree">         </ul>     </div> </body> </html>

原文地址:https://www.cnblogs.com/hcf-0320/p/4397643.html