转自：http://blog.csdn.net/yenange/article/details/7262682
这绝对是我见过最完美的tree了，虽然是国产货，但一点不输国外产品，国外的还没有见过这么强的。
__________________________________________________________________________________
下面是简单的使用demo:
- <!DOCTYPE html>
- <html>
- <head>
- <title>ZTREE DEMO - Standard Data </title>
- <meta http-equiv="content-type" content="text/html; charset=UTF-8">
- <link href="css/zTreeStyle/zTreeStyle.css" rel="stylesheet" type="text/css" />
- <script src="js/jquery-1.4.4.min.js" type="text/javascript"></script>
- <script src="js/jquery.ztree.core-3.4.js" type="text/javascript"></script>
- <script type="text/javascript">
- var setting = {
- view: {
- selectedMulti: false //禁止多点选中
- },
- data: {
- simpleData: {
- enable:true,
- idKey: "id",
- pIdKey: "pId",
- rootPId: ""
- }
- },
- callback: {
- onClick: function(treeId, treeNode) {
- var treeObj = $.fn.zTree.getZTreeObj(treeNode);
- var selectedNode = treeObj.getSelectedNodes()[0];
- $("#txtId").val(selectedNode.id);
- $("#txtAddress").val(selectedNode.name);
- }
- }
- };
- var zNodes =[
- {id:1, pId:0, name:"广东", open:true},
- {id:101, pId:1, name:"广州", file:"core/standardData"},
- {id:102, pId:1, name:"深圳", file:"core/simpleData"},
- {id:103, pId:1, name:"东莞", file:"core/noline"}
- ];
- $(document).ready(function(){
- $.fn.zTree.init($("#treeDemo"), setting, zNodes);
- });
- </script>
- </head>
- <body>
- <div style="float:left;" >
- <ul id="treeDemo" class="ztree">
- </ul>
- </div>
- <div style="float:left;" >
- id: <input id="txtId" type="text" value="" /><br />
- 地名：<input id="txtAddress" type="text" value="" />
- </div>
- </body>
- </html>
相关推荐
《jQuery zTree——构建树形下拉框的详解与应用》 在Web开发中，为了提升用户体验和界面的交互性，我们常常会遇到需要展示层级结构数据的情况，这时树形控件便显得尤为重要。jQuery zTree是一款基于jQuery的优秀...
《jQuery zTree_v3——构建动态交互式树形菜单的利器》 在Web开发中，交互性和用户体验成为了衡量一个网站质量的重要标准。zTree，作为一个基于jQuery的开源插件，以其出色的性能、丰富的配置选项以及多样的功能...
《JQuery_zTree详解——构建高效可扩展的树形数据管理》 JQuery_zTree是一款基于jQuery库的开源插件，专门用于构建交互式的树形菜单和数据展示。它的核心特性在于提供了一种灵活、易用的方式来管理和操作树形结构的...
《jQuery ZTree详解——打造交互式树形菜单与数据管理》 jQuery ZTree是一款基于jQuery的开源插件，专门用于构建交互式的树形菜单。它以其丰富的功能、强大的可定制性和出色的性能，广泛应用于网站的导航菜单、组织...
这个压缩包包含的是一个基于jQuery的树形控件插件——jQuery zTree，版本为2.2.1215。zTree是一款高效、灵活且功能丰富的JavaScript树状菜单组件，它在网页中广泛用于构建目录结构、文件系统展示以及组织图表等应用...
《zTree——jQuery多功能树插件详解》 在前端开发中，树形结构的数据展示是一项常见的需求，例如组织架构、文件目录等。zTree作为一款基于jQuery的插件，以其强大的功能、高效的性能以及易用的配置选项，成为了...
2. **zTree插件**：`jquery-ztree-2.5.js`和`jquery-ztree-2.5.min.js`是zTree插件的完整版和压缩版，包含了所有功能和样式。zTree是jQuery树形插件中的一款流行选择，它提供了丰富的API和配置项，可以灵活定制。 *...
总的来说，"基于jQuery的超强树形菜单"——zTree，是一个功能强大的工具，它帮助开发者快速构建具有高级特性的树形菜单，从而提升网页的交互性和用户体验。通过深入了解和熟练使用zTree，你可以创建出既美观又实用的...
**jQuery超级树插件——全面解析** 在网页开发中，数据结构的可视化展示常常需要用到树形结构，jQuery超级树（通常指zTree）是一个广泛使用的JavaScript插件，它提供了丰富的功能，包括动态加载、XML配置以及节点...
总之，jQuery zTree是一个强大且易用的树形菜单插件，其丰富的功能和良好的扩展性使其在各种项目中都能得到广泛应用。通过理解和掌握zTree的配置和API，我们可以轻松地构建出满足业务需求的树形菜单。
标题“jq zTree js”提及的是一个基于jQuery的JavaScript库——zTree，它是一个功能丰富的树形插件，常用于构建可交互的、动态的树状数据结构。zTree不仅支持基本的节点展示，还提供了丰富的选择、操作和自定义功能...
【标题】"archive_zTree(JQuery Tree) v3.1.zip.zip" 提供的是一个用于构建树形结构的jQuery插件——zTree的v3.1版本。zTree是一款广泛应用于网页开发中的JavaScript库，它使得在网页上展示层级关系的数据变得更加...
**zTree插件详解——基于Bootstrap风格** zTree是一款基于jQuery的树形插件，它在HTML/C开发中被广泛使用，特别是在构建交互式的、层级结构的界面时。本篇文章将深入探讨zTree的核心功能、如何与Bootstrap风格相...
《zTree_v3_master——基于jQuery的多功能树插件详解》 zTree_v3_master，这个标题代表着我们即将深入探讨的是zTree插件的第三版。zTree是一款基于JavaScript库jQuery构建的多功能“树插件”，它以其高效、可定制化...
在本文中，我们将深入探讨jQuery库的一个扩展插件——zTree的异步加载功能。zTree是一款基于jQuery的树形控件，它提供了丰富的交互效果和灵活的数据处理方式。异步加载是zTree的一项重要特性，它使得大量数据的展现...
**JS特效**和**JS常用代码**是ztree插件的两个重要标签。JS特效指的是通过JavaScript实现的各种视觉效果，ztree的展开/收缩动画、节点选中效果等都属于此类。JS常用代码则表明ztree包含了一些在实际项目中经常需要...
zTree是一个基于jQuery的树插件，它提供了丰富的配置选项和API，支持多种数据格式，包括JSON、XML等，同时具备异步加载数据的能力，能够动态地根据用户的操作加载子节点，显著提升了用户体验。在SSM项目中结合zTree...
在本文中，我们将深入探讨如何使用jQuery库中的ZTree插件来实现右键菜单的收藏功能。ZTree是一款强大的JavaScript树形控件，它提供了丰富的交互性和自定义配置，广泛应用于网页中的数据展示和管理。 首先，理解...
**js树状图插件——zTree详解** 在前端开发中，树状图是一种常见的数据展示方式，尤其在管理后台、文件系统或者组织结构展示等场景中应用广泛。`zTree`是一个基于jQuery的插件，它为开发者提供了强大且易用的树形...