日期:2014-05-16 浏览次数:20466 次
1,下载dhmtlxtree : http://www.dhtmlx.com/docs/products/dhtmlxTree/index.shtml
2,解压? 然后新建项目:dhmtltree
3,index.jsp 头部引入:
?
<link rel="STYLESHEET" type="text/css" href="codebase/dhtmlxtree.css"> <script src="codebase/dhtmlxcommon.js"></script> <script src="codebase/dhtmlxtree.js"></script>?
?
这三个文件 所以用到的。
4,body 部分
?
?
<div id="treeboxbox_tree"></div> <script language="javascript"> tree=new dhtmlXTreeObject("treeboxbox_tree","100%","100%",0);//参数一是树所在页面组件的id,参数 四是根节点id,可以是任意值或者字符串 tree.setSkin('dhx_skyblue'); //样式名称,当然,在你的样式文件中对应样式应该存在;蔽日:dhtmlxtree.css中 tree.setImagePath("codebase/imgs/"); //树显示需要的各种图片文件目录,你可以在这里修改相应图片 //tree.setOnClickHandler(doOnClick); tree.enableDragAndDrop(0); //是否允许拖拽 tree.enableTreeLines(true); //是否显示节点间的连线,默认false // tree.setDataMode("json"); //设置数据类型;默认是xml,注意:如果使用json加载数据,这里必须设置,否则dhtmlxtree会因为不会解析xml内容而抛出异常 //设置动态加载数据的url;其他数据类型也可,不限定xml,只要设置了该属性, //dhtmlxtree就可以在其他未加载数据的节点展开时去指定url读取数据,并提交一些参数, //为获取指定数据提供搜索条件如:uid=1262758315073&id=x4&a_dhx_rSeed=1262758315073,这是使用httpwatch抓取的提交请求参数,通常我们只需要id即可; tree.setXMLAutoLoading("node.xml"); tree.loadXML("node.xml"); //首次需要我们手动调用一次,以便加载根节点等基础信息; </script>??
?
5,node.xml
?
<?xml version="1.0" encoding="UTF-8"?> <tree id="0"> <item id="t_root" text="dhmtlxtree" im0="folderClosed.gif" im1="folderClosed.gif" im2="folderClosed.gif"> <userdata name="url">a.jsp</userdata> <item id="node1" text="dhmtlxtree1"> <userdata name="url">a.jsp</userdata> <item id="node1_1" text="dhmtlxtree11"></item> <item id="node1_2" text="dhmtlxtree22"></item> </item> <item id="node2" text="dhmtlxtree2"> <userdata name="file">a.jsp</userdata> </item> <item id="node3" text="dhmtlxtree3"> <userdata name="url">a.jsp</userdata> </item> <item id="node4" text="dhmtlxtree4"> <userdata name="url">a.jsp</userdata> </item> </item> </tree>?
?
?