【zTree】zTree展开树节点
今天在做zTree树的时候想着将第一级tree展开,于是利用下面方法:
/**
* 展开树节点的第一层
*/
function openFirstTreenode(){
// 获取树对象
var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
/* 获取所有树节点 */
var nodes = treeObj.transformToArray(treeObj.getNodes());
//当再次点击节点时条件不符合,直接跳出方法
// 遍历树节点设置树节点为选中
for (var i = 0, length_1 = nodes.length; i < length_1; i++) {
if(nodes[i].level == 0){
alert(nodes[i].open)
nodes[i].open = true;
}
}
}
根据ztree的官网介绍,open属性是设置是否展开此节点,level是树的等级。可是发现这种方法只能展开除一级之外的其他节点,对根节点却不生效,百度找到以下方法:
下面会直接展开第一级树:
/**
* 展开树节点的第一层
*/
function openFirstTreenode(){
// 获取树对象
var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
/* 获取所有树节点 */
var nodes = treeObj.transformToArray(treeObj.getNodes());
//展开第一级树
treeObj.expandNode(nodes[0], true);
}
效果:

如果想展开树的所有节点,需要以下JS:
/**
* 展开树的所有节点
*/
function openAllTreenode(){ // 获取树对象
var treeObj = $.fn.zTree.getZTreeObj("treeDiv");
/* 获取所有树节点 */
var nodes = treeObj.transformToArray(treeObj.getNodes());
// 展开除第一级之外的其他节点
for (var i = 0, length_1 = nodes.length; i < length_1; i++) {
if(nodes[i].level == 0){
continue;
}
nodes[i].open = true;
}
//展开第一级节点
treeObj.expandNode(nodes[0], true); }
效果:

补充: expandNode方法的官方解释:

展开树的第一层节点关闭其他层节点的操作
/**
* 展开树节点的第一层且关闭其他节点
*/
function openFirstTreenode(){
// 获取树对象
var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
/* 获取所有树节点 */
var nodes = treeObj.transformToArray(treeObj.getNodes());
// 关闭所有节点
for (var i = 0, length_1 = nodes.length; i < length_1; i++) {
treeObj.expandNode(nodes[i], false);//第二个参数为false证明是折叠
}
//展开第一级节点
treeObj.expandNode(nodes[0], true);//第二个参数为true证明是展开
}
【zTree】zTree展开树节点的更多相关文章
- zTree实现删除树节点
zTree实现删除树节点 1.实现源码 <!DOCTYPE html> <html> <head> <title>zTree实现基本树</titl ...
- 如何自定义修改ztree树节点的图标
1.此种情况是针对后对数据没有不好判断谁是父节点和子节点的问题 ztree默认的树节点,父子节点的图标不大好看,修改图片只需要在数据的地方添加icon的键,值就是图片的相对位置,但是问题就是需要区分是 ...
- ElementUI如何展开指定Tree树节点
原文:https://blog.csdn.net/gaojie_csdn/article/details/80738488 [问题] 在页面使用ElementUI的时候,想做出一个主动展开树节点的效果 ...
- zTree怎么判断树有节点展开或者完全关闭的
树节点有个open属性,引用API: 记录 treeNode 节点的 展开 / 折叠 状态.1.初始化节点数据时,如果设定 treeNode.open = true,则会直接展开此节点2.叶子节点 t ...
- 把zTree前的展开收起图标改为三角形,且只有在点击三角形图标时才展开子节点解决方案
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta ht ...
- 使用zTree和json构建简单树节点
我们经常碰到须要构建树结构展示的情况,我推荐使用zTree和JSON. 比如: <? php /** * * 使用zTree和json构建树节点 * */ $arr = array( 0=> ...
- zTree实现删除树子节点
zTree实现删除树子节点 1.实现源码 <!DOCTYPE html> <html> <head> <title>zTree实现基本树</tit ...
- ztree根据treeId展开指定节点并触发单击事件
ztree.expandNode(ztree.getNodeByParam("id",treeId,null));//展开指定节点 ztree.selectNode(ztree.g ...
- zTree变异篇:如何让同级树节点平铺而非垂直显示
昨天有一个zTree的使用者在实际的项目中有着这样一个特殊的需求,要求同级树节点能够水平显示,根据设定的宽度自动换行,效果图如下所示: 通过在浏览器调试模式下观察其同级节点的css为: 这个dis ...
随机推荐
- SQL SERVER SA密码忘记,windows集成身份验证都登录不了不怎么办
有时候SQL SERVER 的SA强密码策略真的很烦人,不同的系统密码策略又不一样,导致经常会忘记密码,这不,这回我本机的SQL SERVER很久不用了,彻底忘了密码是什么.查了一下资料还是找到了解决 ...
- 编码转换,基础,copy
阅读目录 编码转换 基础补充 深浅拷贝 文件操作 一,编码转换 1. ASCII : 最早的编码. ⾥⾯有英⽂⼤写字⺟, ⼩写字⺟, 数字, ⼀些特殊字符. 没有中⽂, 8个01代码, 8个bit, ...
- js简易随机打乱数组方法
打乱随机数算法很多,不过看这个还挺简便的,记录下来. function shuffle(a) { var len = a.length; for(var i=0;i<len;i++){ var ...
- Contest 5
A:这我怎么没学傻了啊.整个一傻逼题一眼容斥我连暴力都写不出来啊.显然序列是没有什么用的,考虑求众数小于x的概率,显然可以枚举有几个超过容斥一发.虽然要算的组合数非常大,发现可以抵消很大一部分,最后算 ...
- 【BZOJ4300】绝世好题(动态规划)
[BZOJ4300]绝世好题(动态规划) 题面 BZOJ Description 给定一个长度为n的数列ai,求ai的子序列bi的最长长度,满足bi&bi-1!=0(2<=i<=l ...
- 【洛谷3674】小清新人渣的本愿(莫队,bitset)
[洛谷3674]小清新人渣的本愿(莫队,bitset) 题面 洛谷,自己去看去,太长了 题解 很显然的莫队. 但是怎么查询那几个询问. 对于询问乘积,显然可以暴力枚举因数(反正加起来也是\(O(n\s ...
- max os x lighttpd + php + mysql 部署
手贱,升级了max os x 到Yosemite,系统默认装了nginx,php,开机会自动启动!1 开机启动脚本默认在下面位置: /Library/LaunchDaemons/com.root.ng ...
- 【bzoj3687】简单题
#3687. 简单题 内存限制:512 MiB时间限制:10 Sec 提交提交记录讨论 题目描述 小呆开始研究集合论了,他提出了关于一个数集四个问题:1.子集的异或和的算术和.2.子集的异或和的异或和 ...
- c++ 智能指针(转)
智能指针的使用 智能指针是在 <memory> 标头文件中的 std 命名空间中定义的. 它们对 RAII 或“获取资源即初始化”编程惯用法至关重要. 此习惯用法的主要目的是确保资源获取与 ...
- mesos+marathon+zookeeper+docker
http://mesosphere.com/docs/mesosphere/getting-started/single-node-install/ mesos-master --zk=zk://lo ...