JQuery zTree core v3.5.23

http://zTree.me/

Date: 2016-04-01

zTree 是利用 JQuery 的核心代码,实现一套能完成大部分常用功能的 Tree 插件

兼容 IE、FireFox、Chrome 等浏览器

在一个页面内可同时生成多个 Tree 实例

支持 JSON 数据

支持一次性静态生成 和 Ajax 异步加载 两种方式

支持多种事件响应及反馈

支持 Tree 的节点移动、编辑、删除

支持任意更换皮肤 / 个性化图标(依靠css)

支持极其灵活的 checkbox 或 radio 选择功能

简单的参数配置实现 灵活多变的功能


http://www.bootcdn.cn/zTree.v3/

http://www.ztree.me/v3/api.php  API  (API的说明太简陋)

http://www.ztree.me/v3/demo.php  DEMO  (主要还是要看DEMO里面的源码。)

<script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
<link href="http://cdn.bootcss.com/zTree.v3/3.5.23/css/zTreeStyle/zTreeStyle.css" rel="stylesheet">
<script src="http://cdn.bootcss.com/zTree.v3/3.5.23/js/jquery.ztree.all.js"></script>
<script type="text/javascript">
var setting = {
//显示复选框
check: {
enable: true
},
/*
//显示单选框
check: {
enable: true,
chkStyle: "radio",
radioType: "level"
},
*/
};
var zNodes =[
{ name:"父节点1 - 展开", open:true,
children: [
{ name:"父节点11 - 折叠",
children: [
{ name:"叶子节点111"},
{ name:"叶子节点112"},
{ name:"叶子节点113"},
{ name:"叶子节点114"}
]},
{ name:"父节点12 - 折叠",
children: [
{ name:"叶子节点121"},
{ name:"叶子节点122"},
{ name:"叶子节点123"},
{ name:"叶子节点124"}
]},
{ name:"父节点13 - 没有子节点", isParent:true}
]},
{ name:"父节点2 - 折叠",
children: [
{ name:"父节点21 - 展开展开展开展开", open:true, checked:true,
children: [
{ name:"叶子节点211"},
{ name:"叶子节点212"},
{ name:"叶子节点213"},
{ name:"叶子节点214"}
]},
{ name:"父节点22 - 折叠",
children: [
{ name:"叶子节点221"},
{ name:"叶子节点222"},
{ name:"叶子节点223"},
{ name:"叶子节点224"}
]},
{ name:"父节点23 - 折叠",
children: [
{ name:"叶子节点231"},
{ name:"叶子节点232"},
{ name:"叶子节点233"},
{ name:"叶子节点234"}
]}
]},
{ name:"父节点3 - 没有子节点", isParent:true}
]; $(function(){
$.fn.zTree.init($("#treeDemo"), setting, zNodes);
});
</script>
<ul id="treeDemo" class="ztree"></ul>

..

插件:zTree的更多相关文章

  1. Jquery插件Ztree使用所遇问题

    问题1.$.fn.zTree为空或为Undefined 我在MVC中引用Jquery插件Ztree的JS并不存任何问题,而当我将Ztree的js引入项目中,就出现$.fn.zTree为空或为Undef ...

  2. js插件ztree使用

    最新给公司后台写了一个配置页面,在网上搜到一个js插件ztree,记录一下使用心得. 首先说一下ztree官网,好多方法我都是从官网api上学习的,官网地址http://www.treejs.cn/v ...

  3. 插件使用一树形插件---zTree

    zTree是一款挺好用的树形插件,中文文档齐全,demo丰富. 官方网站是 http://www.treejs.cn/v3/main.php#_zTreeInfo 源码网站 https://githu ...

  4. JQuery树插件——ztree

    API与Demo:http://www.treejs.cn/v3/api.php 使用插件,第一步依然是引入: <link rel="stylesheet" href=&qu ...

  5. 项目中jquery插件ztree使用记录

    最近公司要求做一个关于后台的管理系统.在这个mvvm模式横行的年代,虽然这里用jquery做项目可能有点不符合时代的潮流,但是管他呢,能做出来先在说呗(公司以后要改用angular或者vue来统一前端 ...

  6. jQuery插件--zTree中点击节点实现页面跳转时弹出两个页面的问题

    这是第一次使用zTree,所以在使用之前我要先写一个demo来学习一下.我们要注意的是,zTree是一个jQuery插件,所以我们在导入zTree的js文件之前要先导入jQuery的js文件. 我们先 ...

  7. 树 插件 ztree 的基本用法

    因业务需要 用到 ztree 插件 第一次用tree插件上手有点难度 官网 http://www.treejs.cn/v3/main.php#_zTreeInfo 第一步:初始化树,树的所有数据从后台 ...

  8. 一个神奇的jq插件----zTree

    最近在公司做项目中用到了一个树(ztree)的插件,使用起来非常顺手,便写下这篇博客,用来记录一下,以便后续使用 首先先放上ztree官方的地址:http://www.treejs.cn/v3/mai ...

  9. ASP.NET中使用开源插件zTree的小结

    在最近的项目应用中,找到了zTree免费的好东西,这里总结一下: 源码下载:http://www.ztree.me/ 效果是酱紫的: 前台代码: 样式和脚本 <link rel="st ...

  10. 无限树Jquery插件zTree的使用方法

    其实Ztree官网已经有详细的API文档,一切以官网上的说明为准,我在此只是结合实践总结几条常用的ztree的功能特性. (ztree的语法结构是基于key-value的形式配置) 1:支持异步加载数 ...

随机推荐

  1. Composer的学习

    来自http://blog.sina.com.cn/s/blog_6262a50e0101b5ut.html 简介 composer是PHP中的一个依赖关系管理工具.只要(按指定格式)声明项目所依赖的 ...

  2. oracle数据库使用小结

    select * from r_patient a where a.birthdate= to_date('1953-03-01','yyyy-mm-dd');select * from r_pati ...

  3. 黄聪:pjax使用心得总结

    初次结识pjax是在使用tower时钟发现的.当时使用时发现网站可以局部刷新,当然我们知道使用ajax也是可以实现局部刷新的. 然而我们知道,使用ajax进行局部刷新时网站的title是不会变化的,并 ...

  4. Spring mvc Json 的正确返回姿势

    我们经常都需要封装统一JSON格式 例如以下形式 { “data”:“输出的数据”, “code”:“响应代码”, “msg”:“响应信息” } /** * Created by linli on 2 ...

  5. Ubuntu16.04 创建桌面快捷方式

    一.基本概念 Linux 系统中的Desktop Entry 文件以desktop为后缀名.Desktop Entry 文件是 Linux 桌面系统中用于描述程序启动配置信息的文件. 进入/usr/s ...

  6. 【转】hive中UDF、UDAF和UDTF使用

    原博文出自于: http://blog.csdn.net/liuj2511981/article/details/8523084 感谢! Hive进行UDF开发十分简单,此处所说UDF为Tempora ...

  7. 固态硬盘使用简要手册——windows平台

    第一步,请安装它. 第二步,请关闭磁盘整理功能,如图 详细:控制面板--管理工具--任务计划程序 打开界面,设置如下 图1 第三步:预读(Superfetch)和快速搜索(Windows Search ...

  8. 将 GitHub 的某人的特定仓库复制到自己的账户下 的方法

    访问仓库页面,点击 Fork 按钮创建自己的仓库 Fork 就是将 GitHub 的某个特定仓库复制到自己的账户下. Fork 出的仓库与原仓库是两个不同的仓库,开发者可以随意编辑. 新建的仓库名为& ...

  9. Java-Runoob-高级教程-实例-时间处理:01. Java 实例 - 格式化时间(SimpleDateFormat)

    ylbtech-Java-Runoob-高级教程-实例-时间处理:01. Java 实例 - 格式化时间(SimpleDateFormat) 1.返回顶部 1. Java 实例 - 格式化时间(Sim ...

  10. 云中树莓派(3):通过 AWS IoT 控制树莓派上的 Led

    云中树莓派(1):环境准备 云中树莓派(2):将传感器数据上传到AWS IoT 并利用Kibana进行展示 云中树莓派(3):通过 AWS IoT 控制树莓派上的Led 云中树莓派(4):利用声音传感 ...