"http://www.w3.org/1999/xhtml">"Lib/jquery/jquery-1.3.2.min.js"Type="Text/javascript"></script> <link href="Lib/ligerui/skins/aqua/css/ligerui-all.css"Rel="stylesheet"Type="Text/css"/> <script src="Lib/ligerui/js/core/base.js"Type="Text/javascript"></script> <script src="Lib/ligerui/js/plugins/ligertree.js"Type="Text/javascript"></script> <style type="Text/css">. Box {float: Left; }. tree {width:230px; height:200px; margin:10px; border:1px solid #ccc; Overflow:auto; } h4 {margin:10px; } </style> <script type="Text/javascript">varManager=NULL; $ (function () {$ ("#tree1"). Ligertree ({nodewidth: $,//Tree Control widthData:createdata (),//Tree Data SourceCheckBoxtrue,//whether to use a CheckBoxIdfieldname:'ID',//Binding IDIsexpand:2,//whether to expand node false to not expand true to show all nodes specify a number to expand the specified nodeSlidefalse,//node spread effect false No effect true slow spread effectParentidfieldname:'PID'//bind husband ID }); Manager= $("#tree1"). Ligergettreemanager (); }); //Data Outputfunction Createdata () {vardata = []; Data.push ({ID:1Pid:0, Text:'1'Url:"www.baidu.com", ischecked:true});//set Node ID node content node link selected statusData.push ({ID:2Pid:1, Text:'1.1' }); Data.push ({ID:4Pid:2, Text:'1.1.2' }); Data.push ({ID:5Pid:2, Text:'1.1.2' }); Data.push ({ID:TenPid:8, Text:'Wefwfwfe' }); Data.push ({ID: OnePid:8, Text:'WGEGWGWG' }); Data.push ({ID: APid:8, Text:'GWEGWG' }); Data.push ({ID:6Pid:2, Text:'1.1.3', ischecked:true }); Data.push ({ID:7Pid:2, Text:'1.1.4' }); Data.push ({ID:8Pid:7, Text:'1.1.5' }); Data.push ({ID:9Pid:7, Text:'1.1.6' }); Data.push ({ID: -Pid:0, Text:'1'Url:"www.baidu.com" }); Data.push ({ID: +Pid: -, Text:' A'Url:"www.baidu.com" }); returndata; } function getselected () {varNote = manager.getselected ();//gets the contents of the selected node unchecked ChechboxAlert'the choices are:'+Note.data.url); } function getchecked () {varNotes = Manager.getchecked ();//get selected Chechebox content varText =""; for(vari =0; i < notes.length; i++) {text+ = Notes[i].data.text +","; } alert ('number of nodes selected:'+text); } function CollapseAll () {manager.collapseall ();//Select All} function ExpandAll () {manager.expandall ();//Cancel Select all } </script>"padding:10px"><input value="Select All"onclick="CollapseAll ()"Type="Button"/><input value="Cancel Select all"onclick="CollapseAll ()"Type="Button"/><input value="Get Selection"onclick="getselected ()"Type="Button"/><input value="get selected Chechebox content"onclick="getchecked ()"Type="Button"/> <divclass="Box"> do not expand nodesclass="Tree"> <ul id="tree1"> </ul> </div> </div> <divclass="L-clear"> </div></body>View CodeJquery Ligerui Framework Learning (i) tree data collation