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实现访问到第一节点在相同水平当前所选节点数目的更多相关文章

  1. Ztree _ 横向显示子节点、点击文字勾选、去除指定元素input的勾选状态

    前些天项目需要树结构表现数据,需求ztree就能满足所以直接使用ztree只是踩了些小坑... 1.ztree子节点横向显示(下图): 效果说明:第三级子节点按需求横向显示其他竖向显示,每行最多显示5 ...

  2. zTree实现单独选中根节点中第一个节点

    zTree实现单独选中根节点中第一个节点 1.实现源码 <!DOCTYPE html> <html> <head> <title>zTree实现基本树& ...

  3. ztree异步加载树节点

    参考文档:https://www.cnblogs.com/tenWood/p/8620708.html ztree api地址:http://www.treejs.cn/v3/api.php 说明:j ...

  4. jquery zTree 查找所有的叶子节点

    jquery zTree 查找所有的叶子节点 // 保存所有叶子节点 10 为初始化大小,并非数组上限 var arrayObj = new Array([10]); /* treeNode: 根节点 ...

  5. zTree实现删除树子节点

    zTree实现删除树子节点 1.实现源码 <!DOCTYPE html> <html> <head> <title>zTree实现基本树</tit ...

  6. Z-tree 统计每一父节点的叶子节点数(看这一篇就够了)

    最近刚走出校园的我找到了第一份工作,在入职考核中就遇见了一道Z-tree的试题 这道题目本身是不难的,但是我第一次接触这个插件而且还把解决问题的方向搞错了,弄的我好几天都很难受. 弄得我都开始怀疑人生 ...

  7. zTree自动点击第一个节点（转载）

    var setting = { view: { dblClickExpand: true,//双击展开 showLayer: false, selectedMulti: false,//是否允许多选 ...

  8. zTree判断是否为父节点

    var treeObj = $.fn.zTree.getZTreeObj("tree"); var nodes = treeObj.getSelectedNodes(); if(t ...

  9. ztree模糊筛选展开选中节点

    树呢是一个最简单的树,并没有做一异步加载,也就是一个筛选,然后跳到第一个符合删选的数据下,并且所有符合的都会被展开和选中.其中ztreeAry是一个模拟的本地数组json.在test.json中,如果 ...

随机推荐

  1. Spring整合JMS-基于activeMQ实现（二）

    Spring整合JMS-基于activeMQ实现(二) 1.消息监听器      在Spring整合JMS的应用中我们在定义消息监听器的时候一共能够定义三种类型的消息监听器,各自是MessageLis ...

  2. uva live 4394 String painter 间隔dp

    // uva live 4394 String painter // // 问题是,在培训指导dp运动主题,乍一看,我以为只是一点点复杂 // A A磕磕磕,两个半小时后,.发现超过例子.然而,鉴于他 ...

  3. HTTP请求WebTool

    /// <summary> /// 执行HTTP POST请求. /// </summary> /// <param name="url">请求 ...

  4. 一起学习android图片四舍五入图片集资源 （28）

    效果图: 參看下面代码: public class MainActivity extends Activity { private ImageView imageView1; private Imag ...

  5. Java反射探索研究（转）

    林炳文Evankaka原创作品.转载请注明出处http://blog.csdn.net/evankakay 摘要:本文详细深入讲解是Java中反射的机制,并介绍了如何通过反射来生成对象.调用函数.取得 ...

  6. 【leetCode百题成就】Gas Station解题报告

    题目: There are N gas stations along a circular route, where the amount of gas at station i is gas[i]. ...

  7. OpenCV在MFC图像控件内显示图像

    1.依照文章<OpenCV+MFC显示图像>,完毕配置. 2.创建对应的图像控件,button控件. 3.进行类型转换. 在当前OpenCV2版本号内,图像格式为cv::Mat ,而该格式 ...

  8. 【Web探索之旅】第四部分：Web程序员

    内容简介 1.第四部分第一课:什么是Web程序员? 2.第四部分第二课:如何成为Web程序员? 3.第四部分第三课:成为优秀Web程序员的秘诀 第四部分:Web程序员(完结篇) 大家好.终于来到了[W ...

  9. 我只是不甘心-------Day51

    回放假回家一天,完全断网,天气也很给力配合.水蓝色的天空.白云,抬眼,我没有看到刺目的光芒,但仍眼眼睛刺痛.已经缩小眼,我试图打开眼睛,就像眼泪都流出来了,它不会擦到沙,这是很多其他的没地方. 哥哥去 ...

  10. Oracle的海量存储技术

    下午去參加一个Oracle有关海量数据存储技术的培训讲座了. 地址在广州市林和西路101号天河区计经大楼西側三楼. 培训发起机构为:广州中睿信息技术有限公司. 以下就简要总结一下所听到的一些东西,也算 ...