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);

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

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

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

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • Verizon《市场状况:物联网2017》报告的十大摘要

    Verizon《市场状况:物联网2017》报告的十大摘要

    2022年3月11日
    104
  • 门面模式 Facade「建议收藏」

    门面模式 Facade「建议收藏」门面模式Facade动机模式定义结构要点总结笔记动机上述A方案的问题在于组件的客户和组件中各种复杂的子系统有了过多的耦合,随着外部客户程序和各子系统的演化.这种过多的耦合面临很多变化的挑战如何简化外部客户端和系统间的交互接口呢?如何将外部客户程序的演化和内部子系统的变化之间的依赖相互解耦模式定义为子系统中的一组接口提供一个**一致(稳定)**的界面,Facade模式定义了一个高层接口,这个接口使得这一子系统更加容易使用(复用)结构要点总结从客户程序的角度来看,Facade模式简化了整个

    2022年8月11日
    0
  • ebpf原理分析_HRTEM怎么分析

    ebpf原理分析_HRTEM怎么分析ebpf原理解析

    2022年9月21日
    0
  • python写入换行符_python write换行

    python写入换行符_python write换行在Python中,用open()函数打开一个txt文件,写入一行数据之后需要一个换行如果直接用f.write(’\n’)只会在后面打印一个字符串’\n’,而不是换行’需要用f.write(’\r\n’)注意点:1、python文件写入的时候,当写入一段话之后叠加一个换行符#特别注意的是python中的换行是\n,而不是/n是反斜杠\,而不是斜杠/例子#先写入一…

    2022年9月27日
    0
  • 裸奔程序和uCOS读取DM9000 ID的方法

    裸奔程序和uCOS读取DM9000 ID的方法

    2021年8月6日
    60
  • 51单片机流水灯电路以及C代码「建议收藏」

    51单片机流水灯电路以及C代码「建议收藏」流水灯是51单片机的入门级实验,以下是其电路图以及C代码流水灯proteus电路图此图发光二极管采用共阳极式连接流水灯C代码#include&amp;amp;amp;amp;amp;amp;amp;amp;lt;reg51.h&amp;amp;amp;amp;amp;amp;amp;amp;gt;voiddelay1s(unsignedcharn);voidMovinglight(){ unsignedcharcodeMovinglightA

    2022年5月3日
    59

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

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