Tree树节点选中及取消和指定节点的隐藏

指定节点变色

 指定节点隐藏

单击节点  

未选中则选中该节点

已选中则取消该节点

 

前台：

1.HTML

<ul id="listDept" name="listDept"  data-options="region:'center',border: true"></ul>

2.JS

var deptTree = null;

$(function() {

　　deptTree = $('#listDept');

　　 initTree() ;

}

//初始化树
function initTree() {
　　deptTree.tree({
　　　　url: '../dutyController/listDeptMembers.do',
　　　　animate: false,//定义是否在每个节点前边显示复选框。
　　　　lines : true, //定义是否显示树线条。
　　　　checkbox : true,//定义是否在每个节点前边显示复选框。
　　　　onlyLeafCheck: true,//定义是否只在叶节点前显示复选框。
　　　　onClick: function(node) {//节点点击事件，参数为节点
　　　　　　if(node.checked){//如果该节点被勾选
　　　　　　　　deptTree.tree('uncheck',node.target);//设置该节点被取消勾选
　　　　　　}else{
　　　　　　　　deptTree.tree('check',node.target);//设置该节点被勾选
　　　　　　}
　　　　},
　　　　onBeforeLoad: function() {//请求发出前触发，返回 false 则取消加载动作。
　　　　　　listDutymember();
　　　　},
　　　　onLoadSuccess: function() {//当加载数据的请求发出前触发，返回 false 则取消加载动作。
　　　　　　selectedNode = deptTree.tree('getRoot');//从根节点开始加载树
　　　　　　var nodes = deptTree.tree('getChildren');//获取孩子节点
　　　　　　for(var i=0;i<nodes.length;i++){//遍历 树
　　　　　　　　for(var j=0;j<dutymemberRows.length;j++){//遍历 表
　　　　　　　　　　if(nodes[i].id==dutymemberRows[j].memberid){
　　　　　　　　　　　　node = deptTree.tree('find', dutymemberRows[j].memberid);//查找节点，返回节点对象
　　　　　　　　　　　　// node.target.disabled="disabled";//(node.target).disabled=true
　　　　　　　　　　　　// deptTree[i + 1].disabled = true;
　　　　　　　　　　　　/* $(this).find('span.tree-checkbox').unbind().click(function(){////设置该节点不可编辑
　　　　　　　　　　　　　　return false;
　　　　　　　　　　　　　});*/
　　　　　　　　　　　　node.target.style.color="#EEEE00";//设置节点颜色
　　　　　　　　　　　　node.target.style.display = 'none'; //隐藏节点
　　　　　　　　　　}

　　　　　　　　}
　　　　　　}
　　　　}
　　});
}