Jquery-zTree 他实现的大部分的功能
使用json 作为数据源
所需jquery文件
jquery-1.4.4.min.js（或更高版本）
jquery.ztree.core-3.5.js
下面是简单的示例
<!DOCTYPE html>
<HTML>
<HEAD>
<TITLE> ZTREE DEMO - checkbox</TITLE>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="css/demo.css" type="text/css">
<link rel="stylesheet" href="css/zTreeStyle/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/jquery.ztree.core-3.5.js"></script>
<script type="text/javascript" src="js/jquery.ztree.excheck-3.5.js"></script>
<SCRIPT type="text/javascript">
var setting = {
check: {
enable: true //是否启用 复选框
},
data: {
simpleData: {
enable: true
}
}
};
var zNodes =[
{ id:1, pId:0, name:"随意勾选 1", open:true}, //pId 的 值就是上一级的id值
{ id:11, pId:1, name:"随意勾选 1-1", open:true},
{ id:111, pId:11, name:"随意勾选 1-1-1"},
{ id:112, pId:11, name:"随意勾选 1-1-2"},
{ id:12, pId:1, name:"随意勾选 1-2", open:true},
{ id:121, pId:12, name:"随意勾选 1-2-1"},
{ id:122, pId:12, name:"随意勾选 1-2-2"},
{ id:2, pId:0, name:"随意勾选 2", open:true},
{ id:21, pId:2, name:"随意勾选 2-1"},
{ id:22, pId:2, name:"随意勾选 2-2", open:true},
{ id:221, pId:22, name:"随意勾选 2-2-1"},
{ id:222, pId:22, name:"随意勾选 2-2-2"},
{ id:23, pId:2, name:"随意勾选 2-3"}
];
$(document).ready(function(){
$.fn.zTree.init($("#treeDemo"), setting, zNodes);
setCheck();
});
//-->
</SCRIPT>
</HEAD>
<BODY>
<h1>Checkbox 勾选操作</h1>
<h6>[ 文件路径: excheck/checkbox.html ]</h6>
<div class="content_wrap">
<div class="zTreeDemoBackground left">
<ul id="treeDemo" class="ztree"></ul>
</div>
</div>
</BODY>
</HTML>
效果图
API下载里面有很多实用的demo
分享到：
相关推荐
《Jquery-zTree树形菜单在移动端的实现与应用》 在现代网页开发中，树形菜单作为一种常见的数据展示方式，被广泛应用于导航、层级结构的展现等方面。Jquery-zTree是一款基于jQuery的插件，它能够轻松创建交互式的树...
总的来说，JQuery-zTree是一款强大且易用的树形插件，对于移动端应用来说，其良好的适应性和丰富的功能使得它成为开发树形菜单的理想选择。通过理解和掌握这个项目提供的代码，你将能够快速地在你的移动端项目中集成...
jQuery-zTree是一款基于jQuery的强大的树形插件，它提供了丰富的功能和灵活的配置选项。而将jQuery-zTree与Bootstrap结合，可以使界面更加美观、统一，适应现代网页设计的趋势。本文将详细讲解如何将原始的jQuery-...
jQuery zTree是一款基于jQuery的树形插件，它在Web开发中广泛应用于构建动态、交互式的树状结构。zTree的核心特性在于其轻量级、高度可定制和良好的性能表现，为开发者提供了丰富的API和事件处理机制，使得在网页上...
《jQuery-zTree树插件深度解析与应用实例》 jQuery-zTree是一款广泛应用于网页开发中的JavaScript树形插件，以其高效、灵活、易用的特点深受开发者喜爱。它提供了丰富的功能，包括但不限于动态加载、节点拖放、...
jQuery-zTree是一款基于jQuery库的开源项目，其主要功能是构建动态、可交互的树形结构。它不仅支持基本的树形操作，如展开、折叠、选择节点，还提供了丰富的API接口和自定义事件，允许开发者根据需求进行深度定制。...
《jQuery zTree_v3——构建动态交互式树形菜单的利器》 在Web开发中，交互性和用户体验成为了衡量一个网站质量的重要标准。zTree，作为一个基于jQuery的开源插件，以其出色的性能、丰富的配置选项以及多样的功能...
jQuery-zTree是一款基于JavaScript的开源插件，主要用于构建可交互的树形结构，尤其在Web开发中被广泛应用于数据展示、菜单导航等场景。它结合了jQuery的简洁API与树形结构的高效管理，使得开发者能够轻松实现节点的...
首先，jQuery-zTree是一个强大的JavaScript库，专门用于创建交互式的树形控件。它提供了丰富的API和自定义选项，使得开发者能够轻松地实现节点的添加、删除、编辑、展开和折叠等功能。在本项目中，前端使用zTree展示...
《jQuery ZTree详解——打造交互式树形菜单与数据管理》 jQuery ZTree是一款基于jQuery的开源插件，专门用于构建交互式的树形菜单。它以其丰富的功能、强大的可定制性和出色的性能，广泛应用于网站的导航菜单、组织...
《jQuery.zTree：构建高效灵活的树形菜单导航》 在网页开发中，树形菜单是一种常见的用户界面元素，用于组织和展示层次化的数据。jQuery.zTree是一款强大的JavaScript插件，专为创建交互式、多用途的树形菜单而设计...
Bootstrap风格的zTree树形菜单代码是一款结合了流行的前端框架Bootstrap和强大的jQuery树形插件zTree的解决方案。zTree是一款轻量级的JavaScript组件，它能够帮助开发者快速构建出功能丰富的树形结构，适用于网站...
zTree是一款基于jQuery的树形插件，它具有丰富的配置选项、强大的API接口以及良好的可扩展性，广泛应用于网页中的树状菜单、数据展示等场景。在`JQuery-zTree-v3.1.rar`这个压缩包中，包含了zTree的最新版本v3.1，...
JQuery zTree是一款基于JavaScript的开源树形插件，它主要应用于网页开发，提供丰富的树状数据展示功能。zTree v3.3是该插件的一个版本，它在前一版本的基础上进行了优化和增强，旨在提供更高效、更稳定的服务。 在...
《JQuery zTree v2.6：构建动态树形组件的深入解析》 JQuery zTree v2.6是一款基于JavaScript库JQuery的开源插件，专为构建灵活、功能丰富的树状数据结构而设计。它以其易于使用、高度可定制和强大的功能，广泛应用...
`jQuery-zTree` 是一个基于 jQuery 的开源插件，专门用于在 Web 页面上生成交互式的树形结构。它以其丰富的功能、良好的可定制性和出色的性能，广泛应用于网站导航、数据展示、权限管理等多个场景。 ### 一、核心...
结合MVC3框架，我们可以创建动态、交互式的树形菜单，这对于数据组织和导航非常有帮助。接下来，我将详细讲解如何在MVC3项目中集成和使用jQuery ZTree。 首先，我们需要理解MVC3，这是一个基于.NET Framework的模型...
zTree是一款基于jQuery的插件，专用于实现多级可展开闭合的树形菜单。其简洁的代码结构和直观的操作方式，使得开发者能够快速理解和应用。 1. **zTree基本概念** - **节点（Node）**：zTree中的基本单位，每个节点...
《基于Select2与jQuery-ZTree实现的树形下拉框详解》 在现代网页开发中，用户界面的设计和交互体验愈发重要。一个优秀的界面能够提升用户的操作效率，增强产品的吸引力。今天，我们将深入探讨如何利用Select2和...