zTree.js读取XML文件动态生成目录树

Ztree无法直接加载xml类型的文件,可以先将xml数据读取成json格式的字符串或者直接将数据规整为一个list。

ztree设置

var settingss = {
        data: {
          simpleData: {
            enable: true,  //true 、 false 分别表示 使用 、 不使用 简单数据模式
            idKey: "nodeID",  //节点数据中保存唯一标识的属性名称
            pIdKey: "parentID",    //节点数据中保存其父节点唯一标识的属性名称  
            rootPId: -1  //用于修正根节点父节点数据,即 pIdKey 指定的属性值
                      },
          key: {
            name: "name"  //zTree 节点数据保存节点名称的属性名称  默认值:"name"
               }
              },
        check:{
            enable:true,  //true 、 false 分别表示 显示 、不显示 复选框或单选框
            nocheckInherit:true  //当父节点设置 nocheck = true 时,设置子节点是否自动继承 nocheck = true 
              },

          	callback: {
          		/*
          		点击节点触发的事件
          		*/
          		onClick: function(event, treeId,treeNode) {
          			//$("#nodeIframe").attr("src",treeNode.name);
          			LocateNode(treeNode.name);
          		}
          	}
        };

读取加载xml

function zTree(){
	$.get("/0.c3s.zip_catalog.xml", function(myXml) {
		zNodes="[";
		//遍历xml
		$(myXml).find('Node').each(function(){
					zNodes += 
						"{" + "\"nodeID\":\"" + $(this).attr("nodeID") + "\"," + //获取节点属性信息
							"\"name\":\"" + $(this).attr("Name") + "\"," + //获取节点属性信息
							"\"parentID\":\"" + $(this).attr("parentID") + "\"," + 
							"\"Position\":\"" + $(this).attr("Position") + "\"," + 
							"\"Range\":\"" + $(this).attr("Range") + "\"" +
						"},";
				});
				zNodes = zNodes.substring(0,zNodes.length-1);
				zNodes += "]";
		// console.log(zNodes);
		 //console.log(zNodes);
	    zTreeObj = $.fn.zTree.init($("#treeDemo"), settingss,jQuery.parseJSON(zNodes)); //初始化树
	    zTreeObj.expandAll(true);   //true 节点全部展开、false节点收缩
	})
}

xml文件:

<?xml version="1.0" encoding="utf-8"?>
<nodes>
  <Node nodeID="1" parentID="0" Name="zhygjz02yx0001" Position="120.219647875756,30.2114657897504,46.3723447006196" Azimuth="0.0" Zenith="-0.25" Range="45.4545454545455" FlyTime="2.0"/> 
  <Node nodeID="2" parentID="0" Name="zhygjz02yx0002" Position="120.219969164928,30.2107950747305,51.4490240486339" Azimuth="0.0" Zenith="-0.25" Range="45.4545454545455" FlyTime="2.0"/> 
  <Node nodeID="3" parentID="0" Name="ZHEGSWMX0002" Position="120.219241727253,30.210360067333,57.1780831180513" Azimuth="0.0" Zenith="-0.25" Range="45.4545454545455" FlyTime="2.0"/> 
  <Node nodeID="4" parentID="0" Name="ZHEGSWMX0004" Position="120.218460161549,30.210514662098,55.1974788606167" Azimuth="0.0" Zenith="-0.25" Range="45.4545454545455" FlyTime="2.0"/> 
  <Node nodeID="5" parentID="0" Name="ZHYGLU2MX0001" Position="120.218757687265,30.2117154171725,13.3204045491293" Azimuth="0.0" Zenith="-0.25" Range="45.4545454545455" FlyTime="2.0"/> 
  <Node nodeID="6" parentID="0" Name="ZHYGLU2MX0003" Position="120.220537030838,30.2112189445623,17.0023922072724" Azimuth="0.0" Zenith="-0.25" Range="45.4545454545455" FlyTime="2.0"/> 
  <Node nodeID="7" parentID="0" Name="ZHYGLU2MX0005" Position="120.217829685194,30.2103884908854,14.5594260208309" Azimuth="0.0" Zenith="-0.25" Range="45.4545454545455" FlyTime="2.0"/> 
  <Node nodeID="8" parentID="0" Name="ZHEGDX0001" Position="120.21885351938,30.2103177353991,16.9585577212274" Azimuth="0.0" Zenith="-0.25" Range="45.4545454545455" FlyTime="2.0"/> 
  <Node nodeID="9" parentID="0" Name="ZHYGDX2MX0001" Position="120.219783297381,30.2110810085303,16.4270176291466" Azimuth="0.0" Zenith="-0.25" Range="45.4545454545455" FlyTime="2.0"/> 
  <Node nodeID="10" parentID="0" Name="ZHYGDX2LH0001" Position="120.219871372907,30.2111204808428,18.896433009766" Azimuth="0.0" Zenith="-0.25" Range="45.4545454545455" FlyTime="2.0"/> 
  <Node nodeID="11" parentID="0" Name="ZHEGZB0090" Position="120.218667424554,30.2106835231893,23.7779512889683" Azimuth="0.0" Zenith="-0.25" Range="45.4545454545455" FlyTime="2.0"/> 
</nodes> 
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值