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 findNodes()
{
var treeObj = $.fn.zTree.getZTreeObj("baseTree");
//获取全部节点数据
var nodes = treeObj.getNodes();
for (var i=0, l=nodes.length; i < l; i++)
{
var nodeId = nodes[i].id;
var nodeName = nodes[i].name;
alert("树节点编码:"+nodeId+"\n"+"树节点名称:"+nodeName);
}
}
//-->
</script>
</head>
<body>
<div class="content_wrap">
<div class="zTreeDemoBackground left" style="text-align: center;">
<ul id="baseTree" class="ztree" style="height: 300px; width:200px; overflow-y: auto"></ul>
<input type="button" id="btn" onclick="findNodes()" value="获取全部节点数据"/>
</div>
</div>
</body>
</html>
2、实现结果
(1)初始化
(2)单击“获取全部节点数据”
(3)单击“确定”
3、源码说明
var treeObj = $.fn.zTree.getZTreeObj("baseTree");
//获取全部节点数据
var nodes = treeObj.getNodes();
获取全部一级节点数据
zTree实现获取一级节点数据的更多相关文章
- 用LINQ获取XML节点数据
Insus.NET想对<从字符串中获取XML节点数据> http://www.cnblogs.com/insus/p/3299052.html 这篇改写为使用LINQ的方法实现.LINQ中 ...
- 从字符串中获取XML节点数据
从字符串中获取XML节点数据,前一篇<字符串创建XML文档> http://www.cnblogs.com/insus/p/3298579.html 是储存为一个XML文档.现在,Insu ...
- 【ztree】获取根节点
var node = treeObj.getNodesByFilter(function (node) { return node.level == 0 }, true);
- zTree获取当前节点的下一级子节点数
使用zTree插件实现树形图中,需要获取当前点击的父节点的子节点数的需求,使用treeNode.children获取子节点数据集合,使用length方法获取集合长度.将当前节点的treeNode传入即 ...
- .Net Core中获取appsettings.json中的节点数据
获取ConnectionStrings节点数据 //appsettings.json { "ConnectionStrings": { //DEV "DbConn&quo ...
- layui xtree 实现一级节点单选 ,子节点复选
在外部定义变量和方法 //定义变量 接收顶级节点的值 var topValue; // 获取顶级节点值的方法 function getParent(value) { var val = project ...
- 如何获取json某一级节点的数据
如何获取json某一级节点的数据 最近做项目有获取和设置固定格式某一级节点值的需求.但是要一级一级地取对于多级的结构来说代码过于冗余且重复,于是写了个递归的方法根据json路径完成值的定点操作.废话不 ...
- 160420、zTree获取所有选中节点数据
<!DOCTYPE html><HTML><HEAD> <TITLE> ZTREE DEMO - Standard Data </TITLE> ...
- ztree获取选中节点时不能进入可视区域出现BUG如何解决
zTree 是一个依靠 jQuery 实现的多功能 “树插件”.优异的性能.灵活的配置.多种功能的组合是 zTree 最大优点. zTree 的特点编辑 ● zTree v3.0 将核心代码按照功能进 ...
随机推荐
- jQuery应用操作之---表格
示例: <table> <thread> <tr><th>姓名</th><th>性别</th><th>暂 ...
- 认识python中的set集合及其用法
python中,集合(set)是一个无序排列,可哈希, 支持集合关系测试,不支持索引和切片操作,没有特定语法格式, 只能通过工厂函数创建.集合里不会出现两个相同的元素, 所以集合常用来对字符串或元组或 ...
- xBIM 应用与学习 (二)
目录 xBIM 应用与学习 (一) xBIM 应用与学习 (二) xBIM 基本的模型操作 xBIM 日志操作 XBIM 3D 墙壁案例 xBIM 格式之间转换 xBIM 使用Linq 来优化查询 x ...
- POJ 2185 Milking Grid [KMP]
Milking Grid Time Limit: 3000MS Memory Limit: 65536K Total Submissions: 8226 Accepted: 3549 Desc ...
- HTTP面试题都在这里
HTTP常见面试题 Http与Https的区别: Http与Https的区别: HTTP 的URL 以http:// 开头,而HTTPS 的URL 以https:// 开头 HTTP 是不安全的,而 ...
- JS 特殊字符的验证的问题
个人的JS 的收集方便下次的使用做百度查询: 1. 特殊字符的验证: var pattern = new RegExp("[`~!@#$^&*()=|{}':;',\\[\\].&l ...
- C++ 内存分配(new,operator new)面面观 (转)
本文主要讲述C++ new运算符和operator new, placement new之间的种种关联,new的底层实现,以及operator new的重载和一些在内存池,STL中的应用. 一 new ...
- 【JavaWeb】c3p0连接池与MySQL
正文之前 在之前的文章讲到了传统的JDBC连接MySQL的方式,但是这样的方式在进行多个连接时,就显得效率低下,明显不如连接池的效率,所以我们这次来讲解一下JDBC连接池之一:c3p0 正文 1. 准 ...
- 洛谷P2891 Dining P1402 酒店之王【类二分图匹配】题解+代码
洛谷P2891 Dining P1402 酒店之王[类二分图匹配]题解+代码 酒店之王 题目描述 XX酒店的老板想成为酒店之王,本着这种希望,第一步要将酒店变得人性化.由于很多来住店的旅客有自己喜好的 ...
- angular2-qrcode (转)
插件选择 angular2-qrcode npm install angular2-qrcode --savecnpm install angular2-qrcode --save 参考github ...