zTree实现访问到第一节点在相同水平当前所选节点数目
zTree实现访问到第一节点在相同水平当前所选节点数目
1、实现源代码
<!DOCTYPE html>
<html>
<head>
<title>zTree实现基本树</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="../../../css/demo.css">
<link rel="stylesheet" type="text/css" href="../../../css/zTreeStyle/zTreeStyle.css">
<script type="text/javascript" src="../../../js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="../../../js/jquery.ztree.core-3.5.js"></script>
<script type="text/javascript">
<!--
var setting = {
data: {
simpleData: {
enable: true
}
}
}; var zNodes =[
{ id:1, pId:0, name:"湖北省", open:true},
{ id:11, pId:1, name:"武汉市", open:true},
{ id:111, pId:11, name:"汉口"},
{ id:112, pId:11, name:"汉阳"},
{ id:113, pId:11, name:"武昌"},
{ id:12, pId:1, name:"黄石市"},
{ id:121, pId:12, name:"黄石港区"},
{ id:122, pId:12, name:"西塞山区"},
{ id:123, pId:12, name:"下陆区"},
{ id:124, pId:12, name:"铁山区"},
{ id:13, pId:1, name:"黄冈市"},
{ id:131, pId:13, name:"黄州区"},
{ id:132, pId:13, name:"麻城市"},
{ id:133, pId:13, name:"武穴市"},
{ id:134, pId:13, name:"团风县"},
{ id:135, pId:13, name:"浠水县"},
{ id:136, pId:13, name:"罗田县"},
{ id:137, pId:13, name:"英山县"},
{ id:2, pId:0, name:"湖南省", open:true},
{ id:21, pId:2, name:"长沙市", open:true},
{ id:211, pId:21, name:"芙蓉区"},
{ id:212, pId:21, name:"天心区"},
{ id:213, pId:21, name:"岳麓区"},
{ id:214, pId:21, name:"开福区"},
{ id:22, pId:2, name:"株洲市"},
{ id:221, pId:22, name:"天元区"},
{ id:222, pId:22, name:"荷塘区"},
{ id:223, pId:22, name:"芦淞区"},
{ id:224, pId:22, name:"石峰区"}
]; $(document).ready(function(){
$.fn.zTree.init($("#baseTree"), setting, zNodes);
}); /**
* 获取当前选中的第一个节点在同级节点中的序号
*/
function indexNodes()
{
var treeObj = $.fn.zTree.getZTreeObj("baseTree");
//获取选中的节点
var nodes = treeObj.getSelectedNodes();
if (nodes.length>0)
{
for(var i=0;i<nodes.length;i++)
{
var index = treeObj.getNodeIndex(nodes[i]);
alert("获取当前选中的第一个节点在同级节点中的序号:"+index);
}
}
}
//-->
</script>
</head> <body>
<div class="content_wrap">
<div class="zTreeDemoBackground left">
<ul id="baseTree" class="ztree" style="height: 300px; width:200px; overflow-y: auto"></ul>
<input type="button" id="btn" onclick="indexNodes()" value="获取当前选中的第一个节点在同级节点中的序号"/>
</div>
</div>
</body>
</html>
2、实现结果
(1)初始化
(2)选择“汉口”时
(3)选择“汉阳”时
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveW91MjNoYWk0NQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" width="585" height="348" border="1" alt="">
3、源代码说明
var index = treeObj.getNodeIndex(nodes[i]);
alert("获取当前选中的第一个节点在同级节点中的序号:"+index);
版权声明:本文博客原创文章,博客,未经同意,不得转载。
zTree实现访问到第一节点在相同水平当前所选节点数目的更多相关文章
- Ztree _ 横向显示子节点、点击文字勾选、去除指定元素input的勾选状态
前些天项目需要树结构表现数据,需求ztree就能满足所以直接使用ztree只是踩了些小坑... 1.ztree子节点横向显示(下图): 效果说明:第三级子节点按需求横向显示其他竖向显示,每行最多显示5 ...
- zTree实现单独选中根节点中第一个节点
zTree实现单独选中根节点中第一个节点 1.实现源码 <!DOCTYPE html> <html> <head> <title>zTree实现基本树& ...
- ztree异步加载树节点
参考文档:https://www.cnblogs.com/tenWood/p/8620708.html ztree api地址:http://www.treejs.cn/v3/api.php 说明:j ...
- jquery zTree 查找所有的叶子节点
jquery zTree 查找所有的叶子节点 // 保存所有叶子节点 10 为初始化大小,并非数组上限 var arrayObj = new Array([10]); /* treeNode: 根节点 ...
- zTree实现删除树子节点
zTree实现删除树子节点 1.实现源码 <!DOCTYPE html> <html> <head> <title>zTree实现基本树</tit ...
- Z-tree 统计每一父节点的叶子节点数(看这一篇就够了)
最近刚走出校园的我找到了第一份工作,在入职考核中就遇见了一道Z-tree的试题 这道题目本身是不难的,但是我第一次接触这个插件而且还把解决问题的方向搞错了,弄的我好几天都很难受. 弄得我都开始怀疑人生 ...
- zTree自动点击第一个节点(转载)
var setting = { view: { dblClickExpand: true,//双击展开 showLayer: false, selectedMulti: false,//是否允许多选 ...
- zTree判断是否为父节点
var treeObj = $.fn.zTree.getZTreeObj("tree"); var nodes = treeObj.getSelectedNodes(); if(t ...
- ztree模糊筛选展开选中节点
树呢是一个最简单的树,并没有做一异步加载,也就是一个筛选,然后跳到第一个符合删选的数据下,并且所有符合的都会被展开和选中.其中ztreeAry是一个模拟的本地数组json.在test.json中,如果 ...
随机推荐
- ASF (0) - ASF Java 项目总览
Apache .NET Ant Library This is a library of Ant tasks that help developing .NET software. It includ ...
- HotSpot关联规则算法(2)-- 挖掘连续型和离散型数据
本篇代码可在 http://download.csdn.net/detail/fansy1990/8502323下载. 前篇<HotSpot关联规则算法(1)-- 挖掘离散型数据>分析了离 ...
- Java学习之路:详细解释Java解析XML四种方法
XML如今已经成为一种通用的数据交换格式,它的平台无关性,语言无关性,系统无关性,给数据集成与交互带来了极大的方便. 对于XML本身的语法知识与技术细节,须要阅读相关的技术文献,这里面包含的内容有DO ...
- easyui DateTimeBox OK
一.datetimebox ok按钮没有点击事件,但是可以通过onSelect事件模拟出“点击了ok按钮一样的效果”,我的代码: 关键: 0,理解DateTimeBox控件,这个控件是由DateB ...
- HDU 3681 BFS&像缩进DP&二分法
N*M矩阵.从F出发点.走完全部Y点.每个人格开支1电源点,去G点,电池充满,D无法访问.最小的开始问什么时候满负荷可以去完全部Y.Y和G总共高达15一 第一BFS所有的F.Y.G之间的最短距离. 然 ...
- 004串重量 (keep it up)
设计算法并写出代码移除字符串中反复的字符,不能使用额外的缓存空间. 注意: 能够使用额外的一个或两个变量,但不同意额外再开一个数组拷贝. 简单题直接上代码: #include <stdio.h& ...
- 玩转html5(一)-----盘点html5新增的那些酷酷的input类型和属性
今天正式开始学习html5了,相比html以前的版本,html5新增了好多功能,属性,使我们做出来的界面更加的绚丽,而且使用起来超级简单,这篇文章先来说说html增加的那些input类型和属性. 这些 ...
- hdu 5094 Maze(水搜索)
题目意思:说有一个人在(1,1) 他的目标点在(n,m) 每次是4方向的移动: 限制条件:有的各自之间有墙 或者门,强不可通过,有对应的要钥匙可以开启这个类型的所有门: 问题:求最少步骤数(和): 类 ...
- MapReduce(十五): 从HDFS阅读本文的源代码分析
以Map任务读取文本数据为例: 1) LineRecordReader负责对文件切割的定位,以及对读取每一行内容的封装供用户Map任务使用.每次在定位在文件里不为0的位置时,多读取一行,由于前一个 ...
- Qt5该插件机制(2)--QxxxFactory类和QFactoryLoader类别
<<<<<<<<<<<<<<<<<<<<<<<<< ...