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:"石峰区"},
			{ id:23, pId:2, name:"湘潭市"},
			{ id:231, pId:23, name:"雨湖区"},
			{ id:232, pId:23, name:"岳塘区"},
			{ id:233, pId:23, name:"湘乡市"},
			{ id:234, pId:23, name:"韶山市"}
		];

		$(document).ready(function(){
			$.fn.zTree.init($("#baseTree"), setting, zNodes);
		});

		/**
		 * 删除选中的子节点
		 */
		function removeNodes()
		{
		    var treeObj = $.fn.zTree.getZTreeObj("baseTree");
		    //选中节点
			var nodes = treeObj.getSelectedNodes();
			for (var i=0, l=nodes.length; i < l; i++)
			{
			    //删除选中的子节点
				treeObj.removeChildNodes(nodes[i]);
			}
		}
		//-->
	</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="removeNodes()" value="删除子节点"/>
	</div>
</div>
</body>
</html>

2、实现结果

（1）初始化

（2）选择“武汉”，然后单击“删除子节点”

（3）选择“武汉市”，然后单击“删除子节点”，不能再删除子节点

3、源码说明

//删除选中的子节点

    treeObj.removeChildNodes(nodes[i]);

zTree实现删除树子节点的更多相关文章

  1. zTree实现删除树节点

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

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

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

  3. Trie树子节点快速获取法

    今天做了一道leetcode上关于字典树的题:https://leetcode.com/problems/word-search-ii/#/description 一开始坚持不看别人的思路,完全自己写 ...

  4. (转载)Javascript removeChild()不能删除全部子节点的解决办法

    在Javascript中,只提供了一种删除节点的方法:removeChild().removeChild() 方法用来删除父节点的一个子节点. 语法: parent.removeChild(thisN ...

  5. zTree怎么判断树有节点展开或者完全关闭的

    树节点有个open属性,引用API: 记录 treeNode 节点的 展开 / 折叠 状态.1.初始化节点数据时,如果设定 treeNode.open = true,则会直接展开此节点2.叶子节点 t ...

  6. C++求树子节点权重最大的和

    #include <iostream> #include <vector> using namespace std; int n; const int MaxN = 1e5; ...

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

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

  8. JS-DOM ～ 03. 子节点的操作、style.样式和属性、dom元素的创建方法及操作、14个例题、主要是利用js直接控制html属性

    带有Element和不带的区别 a)  带Element的获取的是元素节点 b)  不带可能获取文本节点和属性节点 获取所以子节点 a)   . childNodes b)   . children ...

  9. zTree -- jQuery 树插件实现点击文字展开子节点

    新版本的zTree是单击+号展开子项,点击文字选中该项,双击文字展开子项 项目用的是3.5版本的,如果要点击文字展开子项暂时没查到资料,自己琢磨了下 项目用的是jquery.ztree.core-3. ...

随机推荐

  1. SQL性能优化的几点建议

    1. 索引:索引可以提高查询的速度,但不是使用带有索引的字段查询时,索引都会起作用,如下几种特殊情况下,有可能使用带有索引的字段查询时,索引没有起作用:1)使用LIKE关键字的查询语句 如果匹配字符串 ...

  2. 洛谷 [P3973] 线性代数

    最大权闭合子图,神题 这不是线性代数,这是网络流. 我们看见这是一堆矩阵的运算,而且最后变成了一个数,那么我们就想到,把这个矩阵乘法的过程用具体的数字推出来 我们发现,a是一个01矩阵,然后其实就可以 ...

  3. 洛谷 [P1024]一元三次方程求解

    一道水题然而坑点很多. #include <iostream> #include <cstdio> #include <algorithm> #include &l ...

  4. BZOJ 1396&&2865 识别子串[后缀自动机 线段树]

    Description 在这个问题中,给定一个字符串S,与一个整数K,定义S的子串T=S(i, j)是关于第K位的识别子串,满足以下两个条件: 1.i≤K≤j. 2.子串T只在S中出现过一次. 例如, ...

  5. CDN设置回源host的意义

    CDN设置回源host的意义 如果CDN后端用户的的源站web服务上没有绑定加速域名,只绑定了其他域名,未限制域名访问(比如通过服务器IP可以访问到默认网站),可以在CDN控制台填写回源host,这样 ...

  6. 小甲鱼OD学习第3讲

    这次我们的任务是破解这个过期的软件,效果如图所示 我们通过阅读代码,知道这个程序的执行流程如图中注释所示 观看下图注释所示 这是失败的提示代码 这是成功的提示代码 最后我们可以得出结论,成功破解软件的 ...

  7. Lua利用cjson读写json

    前言 本文结合本人的实际使用经验和代码示例,介绍如何在Lua中对json进行encode和decode.我这里采用的是Lua CJson库,是一个高性能的JSON解析器和编码器,其性能比纯Lua库要高 ...

  8. main函数的实现解析

    main函数的传参的实现,其实也是一个解析字符串的过程:将每个word后一个空格改为“/0”,将单词提取出来. 就是这么简单. 废话不多说,直接上代码: #include<stdio.h> ...

  9. CentOS 7 安装Java 1.8

    携程的Apollo配置中心服务端[https://github.com/ctripcorp/apollo/wiki]推荐的Java版本是:1.8+, 本文介绍如何在CentOS上安装java 1.8. ...

  10. tomcat管理授权：tomcat-users.xml

    ou are not authorized to view this page. If you have already configured the Manager application to a ...