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'; //隐藏节点
}
}
}
}
});
}
Tree树节点选中及取消和指定节点的隐藏的更多相关文章
- JavaScript对列表节点的操作:删除指定节点、删除最后一个节点、删除第一个节点、删除所有节点、增加节点
使用菜鸟的运行环境直接测试:http://www.runoob.com/try/try.php?filename=tryjs_events <!DOCTYPE html> <html ...
- 数据网格和树-EasyUI Datagrid 数据网格、EasyUI Propertygrid 属性网格、EasyUI Tree 树、EasyUI Treegrid 树形网格
EasyUI Datagrid 数据网格 扩展自 $.fn.panel.defaults.通过 $.fn.datagrid.defaults 重写默认的 defaults. 数据网格(datagrid ...
- 第二百二十六节,jQuery EasyUI,Tree(树)组件
jQuery EasyUI,Tree(树)组件 本节课重点了解 EasyUI 中 Tree(树)组件的使用方法,这个组件依赖于 Draggable(拖 动)和 Droppable(放置)组件. 一.加 ...
- extjs4 treepanel 多个checkbox先中 多个节点选中 多级节点展开
//<%@ page contentType="text/html; charset=utf-8" %> var checkedNodes = { _data:{}, ...
- 【Kubernetes】创建Pod并分配到指定节点
一.编辑yaml文件 [root@K8s-Master Tools]# cat hello-world-pod.yaml apiVersion: v1 kind: Pod metadata: name ...
- easyui Tree模拟级联勾选cascadeCheck,节点选择,父节点自动选中,节点取消,父节点自动取消选择,节点选择,所有子节点全部选择,节点取消,所有子节点全部取消勾选
最近项目中用到easyui tree,发现tree控件的cascadeCheck有些坑,不像miniui 的tree控件,级联勾选符合业务需求,所以就自己重新改写了onCheck事件,符合业务需求.网 ...
- EasyUI取消树节点选中
$('#organTree').find('.tree-node-selected').removeClass('tree-node-selected'); 取消树的节点选中
- ElementUI如何展开指定Tree树节点
原文:https://blog.csdn.net/gaojie_csdn/article/details/80738488 [问题] 在页面使用ElementUI的时候,想做出一个主动展开树节点的效果 ...
- easyui tree选中指定节点,点击指定节点
功能需求描述如下: A主页面,在datagrid的某行上,操作列,点击详情,Tab页面上加载B页面 B页面,左边是树tree,右边是左边树的详情列表 要求:由A页面链接到B页面,B页面的tree,默认 ...
随机推荐
- Angular2入门系列教程7-HTTP(一)-使用Angular2自带的http进行网络请求
上一篇:Angular2入门系列教程6-路由(二)-使用多层级路由并在在路由中传递复杂参数 感觉这篇不是很好写,因为涉及到网络请求,如果采用真实的网络请求,这个例子大家拿到手估计还要自己写一个web ...
- Android Studio 多个编译环境配置 多渠道打包 APK输出配置
看完这篇你学到什么: 熟悉gradle的构建配置 熟悉代码构建环境的目录结构,你知道的不仅仅是只有src/main 开发.生成环境等等环境可以任意切换打包 多渠道打包 APK输出文件配置 需求 一般我 ...
- JavaScript进阶之路(一)初学者的开始
一:写在前面的问题和话 一个javascript初学者的进阶之路! 背景:3年后端(ASP.NET)工作经验,javascript水平一般般,前端水平一般般.学习资料:犀牛书. 如有误导,或者错误的地 ...
- 缓存工具类CacheHelper
代码: using System; using System.Collections.Generic; using System.Linq; using System.Text; using Syst ...
- YII 2.x 模板文件的 beginBlock、beginContent、beginCache
echo '-----------beginBlock--------------------- <br />'; $this->beginBlock('block1', false ...
- Android手机相册的布局
实现类似下面的这种布局的方法
- React Native 之 Text的使用
前言 学习本系列内容需要具备一定 HTML 开发基础,没有基础的朋友可以先转至 HTML快速入门(一) 学习 本人接触 React Native 时间并不是特别长,所以对其中的内容和性质了解可能会有所 ...
- mysql 赋予用户权限
# 赋予权限MySQL> grant 权限参数 on 数据库名称.表名称 to 用户名@用户地址 identified by '用户密码'; # 立即生效权限MySQL> flush pr ...
- Linux基础介绍【第一篇】
Linux简介 什么是操作系统? 操作系统,英文名称Operating System,简称OS,是计算机系统中必不可少的基础系统软件,它是应用程序运行以及用户操作必备的基础环境支撑,是计算机系统的核心 ...
- [jquery]显示隐藏div标签的几种方法
1.$("#demo").attr("style","display:none;");//隐藏div $("#demo" ...