Easyui Tree获取当前选择节点的所有顶级父节点


Posted in Javascript onFebruary 14, 2017

只支持四层目录结构,比较笨的一个方法

JS代码

var node = $('#tree').tree('getSelected'); 
 //获取该节点所有父节点 
           var parentAll = node.text; 
           var flag = ">>"; 
           parentAll = flag.concat(parentAll); 
           var parent = $('#tree').tree('getParent', node.target); 
           if(parent != null && parentOne != ''){ 
              parentAll = (parent.text).concat(parentAll); 
              var parentOne = $('#tree').tree('getParent', parent.target); 
              if(parentOne != null && parentOne != ''){ 
                parentAll = flag.concat(parentAll); 
                parentAll = (parentOne.text).concat(parentAll); 
                var parentTwo = $('#tree').tree('getParent', parentOne.target) 
                if(parentTwo != null && parentTwo != ''){ 
                  parentAll = flag.concat(parentAll); 
                  parentAll = (parentTwo.text).concat(parentAll); 
                } 
              } 
           } 
           $("#path").text(parentAll);

JSP页面代码

<span style="font-size:12px;font-weight:bold;">当前节点:<b id="path"></b></span>

下面看下easyUI Tree显示选中节点的所有父节点

功能需要,显示Tree上所选节点的所有父节点,如图:

Easyui Tree获取当前选择节点的所有顶级父节点 

代码实现如下:

var str = "";
 var parentAll = "";
 parentAll = node.text;
 parentAll = parentAll.replace(/\[[^\)]*\]/g, ""); //获得所需的节点文本
 var flag = ",";
 var parent = $('#leftTree').tree('getParent', node.target); //获取选中节点的父节点
 for (i = 0; i < 6; i++) { //可以视树的层级合理设置I
   if (parent != null) {
     parentAll = flag.concat(parentAll);
     str = (parent.text).replace(/\[[^\)]*\]/g, "");
     parentAll = (str).concat(parentAll);
     var parent = $('#leftTree').tree('getParent', parent.target);
   }
 }
alert(parentAll);

结果显示:

Easyui Tree获取当前选择节点的所有顶级父节点

总结:其实原理很简单,就是获取当前选中节点的父节点,然后通过循环,再求父节点的父节点。通过这个功能的实现,也见识到了查看API的好处!

Javascript 相关文章推荐
基于jQuery实现的水平和垂直居中的div窗口
Aug 08 Javascript
使用jquery解析XML示例代码
Sep 05 Javascript
JavaScript使用encodeURI()和decodeURI()获取字符串值的方法
Aug 04 Javascript
JS实现的简单鼠标跟随DiV层效果完整实例
Oct 31 Javascript
关于JS中match() 和 exec() 返回值和属性的测试
Mar 21 Javascript
AngularJS中实现动画效果的方法
Jul 28 Javascript
JavaScript动态数量的文件上传控件
Nov 18 Javascript
微信小程序开发之实现选项卡(窗口顶部TabBar)页面切换
Nov 25 Javascript
对vue下点击事件传参和不传参的区别详解
Sep 15 Javascript
详解如何webpack使用DllPlugin
Sep 30 Javascript
微信小程序使用map组件实现获取定位城市天气或者指定城市天气数据功能
Jan 22 Javascript
layui实现数据分页功能
Jul 27 Javascript
Vue组件开发初探
Feb 14 #Javascript
JavaScript Base64 作为文件上传的实例代码解析
Feb 14 #Javascript
JavaScript实现定时页面跳转功能示例
Feb 14 #Javascript
javaScript嗅探执行神器-sniffer.js
Feb 14 #Javascript
JS实现的简单图片切换功能示例【测试可用】
Feb 14 #Javascript
Javascript下拉刷新的简单实现
Feb 14 #Javascript
Vue 短信验证码组件开发详解
Feb 14 #Javascript
You might like
php cookis创建实现代码
2009/03/16 PHP
功能强大的php文件上传类
2016/08/29 PHP
PHP  实现等比压缩图片尺寸和大小实例代码
2016/10/08 PHP
PHP使用imagick扩展实现合并图像的方法
2017/04/25 PHP
使用Apache的rewrite
2021/03/09 Servers
jQuery中的bind绑定事件与文本框改变事件的临时解决方法
2010/08/13 Javascript
鼠标选择动态改变网页背景颜色的JS代码
2013/12/10 Javascript
JavaScript利用append添加元素报错的解决方法
2014/07/01 Javascript
jQuery中odd选择器的定义和用法
2014/12/23 Javascript
jQuery实现炫酷的鼠标轨迹特效
2015/02/01 Javascript
本人自用的global.js库源码分享
2015/02/28 Javascript
JS实现获取来自百度,Google,soso,sogou关键词的方法
2016/12/21 Javascript
详解nodejs 文本操作模块-fs模块(五)
2016/12/23 NodeJs
微信小程序自定义多选事件的实现代码
2018/05/17 Javascript
解决element-ui中下拉菜单子选项click事件不触发的问题
2018/08/22 Javascript
在小程序Canvas中使用measureText的方法示例
2018/10/19 Javascript
详解jquery和vue对比
2019/04/16 jQuery
layui实现数据分页功能
2019/07/27 Javascript
Vue快速实现通用表单验证的示例代码
2020/01/09 Javascript
[08:02]DOTA2牵红线 zhou神抱得美人归
2014/03/22 DOTA
记录Django开发心得
2014/07/16 Python
Python求算数平方根和约数的方法汇总
2016/03/09 Python
Python基于回溯法子集树模板解决马踏棋盘问题示例
2017/09/11 Python
python实现Decorator模式实例代码
2018/02/09 Python
神经网络(BP)算法Python实现及应用
2018/04/16 Python
详解python中groupby函数通俗易懂
2020/05/14 Python
CSS Grid布局教程之网格单元格布局
2014/12/30 HTML / CSS
音乐系毕业生自荐信
2013/10/27 职场文书
有多年工作经验的自我评价
2014/03/02 职场文书
就业意向书范文
2014/04/01 职场文书
竞选大队长演讲稿
2014/04/29 职场文书
祖国在我心中演讲稿600字
2014/05/04 职场文书
安全生产先进个人事迹材料
2014/12/30 职场文书
团委工作总结2015
2015/04/02 职场文书
浅谈node.js中间件有哪些类型
2021/04/29 Javascript
浅谈spring boot使用thymeleaf版本的问题
2021/08/04 Java/Android