参考原文:http://flashdream8.iteye.com/blog/906486
http://zhaoshixing1228.blog.163.com/blog/static/282063082011128103829831/
引入必要的js和css
<link rel="stylesheet" type="text/css" href="<c:url value='/style/dhtmlxtree.css'/>">
<script type="text/javascript" src="<c:url value='/scripts/dhtmlxcommon.js'/>"></script>
<script type="text/javascript" src="<c:url value='/scripts/dhtmlxtree.js'/>"></script>
<table>
<tr>
<td valign="top">
<div id="treeboxbox_tree2" style="width:250; height:218;background-color:#f5f5f5;border :1px solid Silver;; overflow:auto;"></div>
</td>
</tr>
</table>
<script>
function treeClick(currentNodeId){
doLog("Item "+tree.getItemText(currentNodeId)+" was selected");
};
tree2=new dhtmlXTreeObject("treeboxbox_tree2","100%","100%",0);
tree2.setImagePath("/office/images/skyblue/");
tree2.enableCheckBoxes(1);
//允许三种状态的复选框(全选、不选、部分选中)
tree2.enableThreeStateCheckboxes(true);
//添加事件
tree2.attachEvent("onClick",treeClick);//点击事件
//允许单击事件
//tree2.setOnClickHandler(tonclick);
tree2.loadXML("<c:url value='/getTree.do'/>");
</script>
附件中为官方dhtmlxtree的示例。
tree的xml加载可以是使用servlet生成xml,也可以是使用action生成xml,我使用的是通过action生成xml。
分享到:
相关推荐
2. **定义右键菜单**:使用dhtmlXtree的`attachEvent`方法,监听`onRightClick`事件。当用户在树的节点上执行右键点击时,这个事件会被触发。你可以在这个事件处理函数中定义你的菜单项,这些菜单项通常是以数组形式...
【DHTMLXTree中文使用手册2.0版本】 在DHTMLX组件库中,DHTMLXTree是一款基于JavaScript的DHTML组件,它主要用于构建富交互式的Web界面,特别是在Ajax技术的支持下,能实现动态更新和高效的数据展示。DHTMLXTree...
这个项目可能包含了HTML、CSS和JavaScript文件,展示了如何集成dhtmlxtree并使用JSON数据来构建和操作树结构。通过分析这个项目,开发者可以学习到如何实际应用dhtmlxtree,以及如何处理和显示JSON数据。 总结来说...
在实际应用中,dhtmlxtree可以与其他前端框架(如jQuery、AngularJS、React等)配合使用,提供更丰富的用户体验。例如,通过AJAX请求获取动态数据,实时更新树状视图;或者结合服务器端技术(如PHP、Java、ASP.NET)...
- **docsExplorer**:可能是一个示例或工具,用于演示如何使用dhtmlxTree来构建文档浏览器。 - **libCompiler**:可能是编译或打包工具,用于处理dhtmlxTree库的源代码和资源。 **5. 学习资源** - `index.html` ...
这篇文章很可能是对dhtmlxtree进行详细介绍,包括它的安装、配置、基本API的使用,以及如何将它集成到项目中,解决实际问题的案例分析。通过阅读这篇博客,读者可以学习如何创建和定制dhtmlxtree实例,理解其核心...
为了更好地理解和使用dhtmlxTree,可以参考`docsExplorer`中的文档,了解详细功能和具体用法。`readme.txt`可能包含了关于如何开始和版本信息等内容,而`index.html`通常是一个示例页面,展示了dhtmlxTree的不同功能...
使用JavaScript来初始化dhtmlxTree。这通常在DOM加载完成后执行,可以使用`window.onload`或`document.addEventListener('DOMContentLoaded')`事件。调用`dhtmlXTreeObject`函数并传入容器的ID,然后调用`init`方法...
**dhtmlXTree详解** dhtmlXTree是一款功能强大的JavaScript组件,它允许开发者在Web应用中创建各种样式的树型菜单。这款组件以其高度自定义的样式和丰富的功能集而备受青睐,尤其适用于构建交互性强、用户体验良好...
dhtmlXTree1.6是一个强大且易于使用的JavaScript组件,为Web开发人员提供了构建交互式树状结构的工具。其丰富的特性、良好的文档支持和广泛的社区资源使其成为实现树形数据展示的理想选择。通过熟练掌握dhtmlXTree的...
压缩包中的`docsExplorer`目录包含了详细的API文档和示例,帮助开发者了解如何使用dhtmlxTree的各种功能。同时,`index.html`和`readme.txt`文件提供了一些基础信息和快速入门指南。 **6. 库集成** dhtmlxTree 3.6...
描述中的链接提到了CSDN博客文章,其中详细介绍了如何使用XML HTTP请求来调用DhtmlxTree。通过XML,开发者可以动态地从服务器获取和显示数据,增强了树结构的实时性。这种技术基于AJAX(Asynchronous JavaScript and...
这个例子展示了如何简单地使用Dhtmlxtree,并且利用XML数据来构建树节点。 首先,我们需要理解Dhtmlxtree的核心概念。Dhtmlxtree是一个客户端的组件,它不依赖服务器端技术,如PHP或ASP.NET,而是通过JavaScript...
例如,在一个项目管理应用中,可以使用dhtmlxtree展示任务的层级关系,通过拖放调整任务顺序,通过复选框选择多个任务,通过右键菜单进行任务的增删改操作。 **六、API与配置选项** dhtmlxtree提供了丰富的API接口...
7. **无障碍访问**:考虑到无障碍访问的需求,dhtmlxtree遵循Web Content Accessibility Guidelines (WCAG),确保视障用户也能通过屏幕阅读器使用。 8. **兼容性**:dhtmlxtree通常能良好地运行在各种现代浏览器上...