zTree实现访问到第一节点在相同水平当前所选节点数目

zTree实现访问到第一节点在相同水平当前所选节点数目

大家好,又见面了,我是全栈君,今天给大家准备了Idea注册码。

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)初始化

zTree实现访问到第一节点在相同水平当前所选节点数目


(2)选择“汉口”时

zTree实现访问到第一节点在相同水平当前所选节点数目


(3)选择“汉阳”时

zTree实现访问到第一节点在相同水平当前所选节点数目


3、源代码说明

var index = treeObj.getNodeIndex(nodes[i]);
alert("获取当前选中的第一个节点在同级节点中的序号:"+index);

版权声明:本文博客原创文章,博客,未经同意,不得转载。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/117238.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • 面试官都震惊,你这网络基础可以啊![通俗易懂]

    面试官都震惊,你这网络基础可以啊![通俗易懂]目录网络1.对网络的基础认识<1>.组网方式<2>.OSI七层模型<3>.TCP/IP五层(四层模型)<4>.对封装分用的理解2.网络数据传输<1>局域网(1)认识IP和MAC(2)网络数据传输的特性(3)网络数据传输流程1)网络互联的方式2).局域网交换机组网的方式3)局域网交换机+路由器组网的方式<2>广域网传输流程3.UDP和TCP<1>UDP协议<2>TCP协议(可靠的传输协议)(1)TCP相关概念(2)

  • 文件无法保存(文件夹已损坏无法读取怎么办)

    要使用EmguCV,首先需要去官网下载安装包(除了下载安装包,还有其他几种方式)。安装完成后,得配置环境变量。这里不再赘述。网上的教程很多。我这里分享一个官网的下载链接:https://sourceforge.net/projects/emgucv/files/emgucv/这里使用窗体程序进行说明,首先新建个窗体1.引用EmguCV的DLL:usingEmgu.CV;usingEmg…

  • viewpager实现画廊(中间图片全部显示,左右显示一部分b布局)无限轮播效果「建议收藏」

    viewpager实现画廊(中间图片全部显示,左右显示一部分b布局)无限轮播效果「建议收藏」一、布局xmlversion=”1.0″encoding=”utf-8″?>RelativeLayoutxmlns:android=”http://schemas.android.com/apk/res/android”    android:id=”@+id/pager_layout”    android:layout_width=”match_

  • 数据库建模

    1)定义:在设计数据库时,对现实世界进行分析、抽象、并从中找出内在联系,进而确定数据库的结构,这一过程就称为数据库建模。2)作用:1.模型能准确表达设计意图,更易于进行技术交流。2.模型可以用来高效地生产代码、脚本、技术文档,可以做到“一处改动,多处同步”的效果。3.模型驱动的开发能使开发过程保持一致性,提高开发人员的效率,而且能保持我们的设计模型能被准确的实现而不产生歪曲。

  • 常用电容分类_电容电阻

    常用电容分类_电容电阻一、瓷介电容器(CC)1.结构用陶瓷材料作介质,在陶瓷表面涂覆一层金属(银)薄膜,再经高温烧结后作为电极而成。瓷介电容器又分1类电介质(NPO、CCG));2类电介质(X7R、2X1)和3类电介质(Y5V、2F4)瓷介电容器。2.特点1类瓷介电容器具有温度系数小、稳定性高、损耗低、耐压高等优点。最大容量不超过1000pF,常用的有CC1、…

  • 大学课程 | 《微机原理与接口技术》知识点总结[通俗易懂]

    大学课程 | 《微机原理与接口技术》知识点总结[通俗易懂]文章目录第一章微型计算机基础概论第一讲关于第二讲微型计算机系统组成第三讲微机工作过程第四讲常用数制第五讲编码第六讲数及其运算第七讲基本逻辑运算和逻辑门第八讲基本逻辑运算及其门电路第二章微处理器与总线第九讲8088/8086微处理器第十讲8088的主要引线及其内部结构第十一讲8088CPU内部寄存器第十二讲实模式下的存储器寻址第十三讲8088系统总线第三章指令系统概述第十四讲8088/8086指令系统第十五讲指令的寻址方式第十六讲数据传送指令第四章算术运算,逻辑运算与

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号