<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>CheckBox Tree - jQuery EasyUI Demo</title> <link rel="stylesheet" type="text/css" href="http://www.cnblogs.com/themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="http://www.cnblogs.com/themes/icon.css"> <link rel="stylesheet" type="text/css" href="../demo.css"> <script type="text/javascript" src="http://www.cnblogs.com/jquery-1.8.0.min.js"></script> <script type="text/javascript" src="http://www.cnblogs.com/jquery.easyui.min.js"></script> </head> <body> <h2>CheckBox Tree</h2> <div class="demo-info"> <div class="demo-tip icon-tip"></div> <div>Tree nodes with check boxes.</div> </div> <div style="margin:10px 0;"> <a href="#" class="easyui-linkbutton" onclick="getChecked()">GetChecked</a> <br/> <input type="checkbox" checked onchange="$('#tt').tree({cascadeCheck:$(this).is(':checked')})">CascadeCheck <input type="checkbox" onchange="$('#tt').tree({onlyLeafCheck:$(this).is(':checked')})">OnlyLeafCheck </div> <ul id="tt" class="easyui-tree" data-options="url:'../tree/json.json',animate:true,checkbox:true"></ul> <script> $(function(){ //此处是扩展tree的两个方法. $.extend($.fn.tree.methods,{ getCheckedExt: function(jq){//扩展getChecked方法,使其能实心节点也一起返回 var checked = $(jq).tree("getChecked"); var checkbox2 = $(jq).find("span.tree-checkbox2").parent(); $.each(checkbox2,function(){ var node = $.extend({}, $.data(this, "tree-node"), { target : this }); checked.push(node); }); return checked; }, getSolidExt:function(jq){//扩展一个能返回实心节点的方法 var checked =[]; var checkbox2 = $(jq).find("span.tree-checkbox2").parent(); $.each(checkbox2,function(){ var node = $.extend({}, $.data(this, "tree-node"), { target : this }); checked.push(node); }); return checked; } }); }); function getChecked(){ var nodes = $('#tt').tree('getCheckedExt'); var s = ''; for(var i=0; i<nodes.length; i++){ if (s != '') s += ','; s += nodes[i].text; } alert(s); } </script> </body> </html>
转载处:http://easyui.btboys.com/extended-easyui-tree-two-methods-to-obtain-solid-node.html