1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677 |
- <!DOCTYPE html>
- <HTML>
- <HEAD>
- <TITLE> ZTREE DEMO - checkbox</TITLE>
- <meta http-equiv="content-type" content="text/html; charset=UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
- <link rel="stylesheet" href="../css/demo.css" type="text/css">
-
- <link rel="stylesheet" href="../css/zTreeStyle/zTreeStyle.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.5.js"></script>
- <script type="text/javascript" src="../js/jquery.ztree.excheck-3.5.js"></script>
- <SCRIPT type="text/javascript">
- <!--
- var setting = {
- check: {
- enable: true
- },
- data: {
- simpleData: {
- enable: true
- }
- }
- };
- var zNodes =[
- {id:4, pId:0, name:"河北省", open:true, nocheck:true},
- {id:41, pId:4, name:"石家庄"},
- {id:42, pId:4, name:"保定"},
- {id:43, pId:4, name:"邯郸"},
- {id:44, pId:4, name:"承德"},
- {id:5, pId:0, name:"广东省", open:true, nocheck:true},
- {id:51, pId:5, name:"广州"},
- {id:52, pId:5, name:"深圳"},
- {id:53, pId:5, name:"东莞"},
- {id:54, pId:5, name:"佛山"},
- {id:6, pId:0, name:"福建省", open:true, nocheck:true},
- {id:61, pId:6, name:"福州"},
- {id:62, pId:6, name:"厦门"},
- {id:63, pId:6, name:"泉州"},
- {id:64, pId:6, name:"三明"}
- ];
- var code;
- function setCheck() {
- var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
- py = $("#py").attr("checked")? "p":"",
- sy = $("#sy").attr("checked")? "s":"",
- pn = $("#pn").attr("checked")? "p":"",
- sn = $("#sn").attr("checked")? "s":"",
- type = { "Y":py + sy, "N":pn + sn};
- zTree.setting.check.chkboxType = type;
- showCode('setting.check.chkboxType = { "Y" : "' + type.Y + '", "N" : "' + type.N + '" };');
- }
- function showCode(str) {
- if (!code) code = $("#code");
- code.empty();
- code.append("<li>"+str+"</li>");
- }
- $(document).ready(function(){
- $.fn.zTree.init($("#treeDemo"), setting, zNodes);
- setCheck();
- $("#py").bind("change", setCheck);
- $("#sy").bind("change", setCheck);
- $("#pn").bind("change", setCheck);
- $("#sn").bind("change", setCheck);
- });
- //-->
- </SCRIPT>
- </HEAD>
- <BODY style="padding-left: 10%">
- <ul id="treeDemo" class="ztree" style="zoom:1.5" ></ul>
- </BODY>
- </HTML>
|