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. 浅谈新一代Android操作系统Android L

    今天早一些的时候,Google公布了新一代Android操作系统Android L.让我很意外的是命名规则的变化,之前外界纷纷推測会叫Android5.0,同一时候会给一个甜品的名字命名.由于Andr ...

  2. bellman_ford寻找平均权值最小的回路

    给定一个有向图,如果存在平均值最小的回路,输出平均值. 使用二分法求解,对于一个猜测值mid,判断是否存在平均值小于mid的回路 如果存在平均值小于mid的包含k条边的回路,那么有w1+w2+w3+. ...

  3. Unity3D在一建筑GL材料可以改变颜色和显示样本

    void CreateLineMaterial()     {         if (!mat)         {             mat = new Material("Sha ...

  4. IM设计与实现的系统模块的聊天记录

    到非常多开发IM系统的朋友都想实现聊天记录存储和查询这一不可或缺的功能,这里我就把自己前段时间为傲瑞通(OrayTalk)开发聊天记录模块的经验分享出来,供须要的朋友參考下. 一.整体设计 1.存储位 ...

  5. 加入指数（IOS开发）

    该指数是用来协助查询. 原则上: - 索引的标题是不完全一样的标题显示: - 指数应该具有一定的代表性,它可表示一组数据: - 假设索引列表视图.在一般情况下不再使用扩展视图. (easy指向) 会又 ...

  6. 入门git

    入门git   0x01前言 既然没有华丽的出场,那就平凡的分享,首先我要说明一点本篇文章针对Git初学者,对我自己学Git的资源的整合,其实本篇索引应该在我写Git系列文章的时候就紧跟着放上索引的, ...

  7. React Native环境配置

    React Native环境配置 史上最全Windows版本搭建安装React Native环境配置 配置过React Native 环境的都知道,在Windows React Native环境配置有 ...

  8. 在VC/MFC中嵌入Google地图——图文并茂

    近期须要实验室须要将在无人机地面站中嵌入地图,在网上找了非常多资料,最终有些眉目了, 首先.做这个须要用到的知识有.MFC控件.MFC类库.JavaScript脚本语言.Google API.Goog ...

  9. UVa 825 - Walking on the Safe Side

    题目:在一个N*M的网格中,从左上角走到右下角,有一些点不能经过,求最短路的条数. 分析:dp,帕斯卡三角.每一个点最短的就是走N条向下,M条向右的路. 到达每一个点的路径条数为左边和上面的路径之和. ...

  10. Java引用类型变量

    Java引用类型变量 1.编译时类型:由声明该变量时使用的类型决定 2.执行时类型:由实际赋给该变量的对象决定    类型不一致的假设编译时类型和执行,可能会出现多态性 版权声明:本文博主原创文章.博 ...