Ztree树的复选框和获取选择的节点实例和代码

最新推荐文章于 2024-07-23 17:35:39 发布

selfImprove_x

最新推荐文章于 2024-07-23 17:35:39 发布

阅读量3w

点赞数 4

分类专栏：笔记文章标签： ztree js 复选框

本文链接：https://blog.csdn.net/u012608167/article/details/50259921

版权

本文介绍了如何在Ztree中添加复选框，并提供了获取选中节点ID的示例代码。通过JavaScript和jQuery，展示了如何初始化Ztree、设置复选框功能、以及获取被选中的公司办公室和策略组ID。还提到了当需要获取所有叶子节点ID时，可以使用`onClick`事件结合递归函数实现。

摘要由CSDN通过智能技术生成

关于ztree中添加复选框的问题，自己研究查资料和api 获取得到被选择的树节点的id。

如图只获取公司办公室和策略组的id

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>
选择收件人
</title>
	<link rel="stylesheet" href="<%=request.getContextPath()%>/css/zTreeStyle/demo.css" type="text/css">
	<link rel="stylesheet" href="<%=request.getContextPath()%>/css/zTreeStyle/zTreeStyle.css" type="text/css">
	<script charset="utf-8" src="<%=request.getContextPath()%>/js/jquery-1.7.1.min.js"></script>
	<script charset="utf-8" src="<%=request.getContextPath()%>/js/jquery.ztree.all-3.5.min.js"></script>
	<SCRIPT type="text/javascript">
	$(function(){
		//查询所有的菜单信息
		$.ajax({
			type:'post',
			url:'getorganization.jsp',
			success:function(result){
				

				var setting = {
					data:{
						simpleData:{
							enable:true
						}
					},
					check: {  
						enable: true
					}

				};
				eval("var ztreenode="+result);
				$.fn.zTree.init($("#treeDemo"),setting,ztreenode);
				SelectNode();
			}
		});
	});
	 function SelectNode() {
            var treeObj = $.fn.zTree.getZTreeObj("treeDemo");
             
            var treenode = treeObj.getNodeByParam("id", <%=code%>, null);
            treeObj.expandNode(treenode, true, true, true);
            treeObj.selectNode(treenode);
        }
	function  fun_getCheckValue(){
	   var zTree = $.fn.zTree.getZTreeObj("treeDemo");
		
				var nodes=zTree.getChangeCheckedNodes(true);

				var result='';
				if(nodes.length==0){
					alert("请选择部门&#x