fortunatelys
fortunatelys

zTree.js

zTree简介

树形控件的使用是应用开发过程中不可少的，zTree是一个依靠jQuery实现的多功能“树插件”，优异的性能，灵活的配置，多功能的组合是zTree最大的优点。

zTree的特点

•最新版的zTree将核心代码按照功能进行了分割，不需要的代码可以不用加载，如普通使用只需要加载核心的jqurey.ztree.exedit-3.5.min.js
•采用了延迟加载技术，上万节点轻松加载，即使在IE6也能基本做到秒杀
•兼容IE、FireFox、Chrome、Opera、Safai 等浏览器
•支持JSON数据
•支持静态和ajax异步加载节点数据
•支持任意更换皮肤/自定义图标（依靠css）
•v支持极其灵活的checkbox 或 radio 选择功能
•提供多种事件响应回调
•灵活的编辑(增/删/改/查)功能，可随意拖拽节点，还可以多节点拖拽
•在一个页面内同时生成多个 Tree 实例
简单的参数配置实现，灵活多变的功能

zTree文件介绍

从zTree官网下载的zTree包括以下组件部分

zTree.js_第1张图片
201682102632108.jpg

•metroStyle文件夹：zTree的metro风格样式相关文件（图片及css样式表）。
•zTreeStyle文件夹：zTree的标准风格样式文件夹（图片及css样式表）
•js文件：zTree.all.js是完整的js库，可单纯加载此文件实现所有zTree功能，ztree.core、ztree.excheck、ztree.exedit、ztree.exhide是对ztree按照功能进行的分割，分别对应基本功能、复选功能、编辑功能、显隐功能。

zTree的基本使用

1.0 zTree的创建
在页面中添加对zTree的js及css引用，由于zTree基于JQuery，JQuery的引用是必须的。



ZTREE DEMO












    运行结果如下

    zTree.js_第2张图片
    Paste_Image.png

    你可能感兴趣的:(zTree.js)

    • 树形下拉框，结合ztree HUSKle javascripthtml
      1、首先引入jq以及ztree.js测试版本的jq是2.1.4jauery在线链接https://cdn.bootcdn.net/ajax/libs/jquery/2.1.4/jquery.min.js以下代码为ztree-select.js/***下拉树*务必先引入jQuery和zTree*/(function($){functionTreeSelect(){varts=newObject();
    • Zookeeper基本数据模型介绍（重点） 偷偷学习被我发现 Zookeeper
      Zookeeper基本数据模型介绍（重点）一、树形结构类似于ztree.js、tree.js这样的组件，其实它是参照了Linux或者Unix目录的树形结构二、路径的形式三、1、在zk中访问目录时也是和linux类似，cd/xx/xxx/2、每一个节点都可以有子节点以及自己的数据，类似于linux中的父目录下的子目录这样的意思，父节点下子节点，节点也可以带有相应的数据3、永久节点：相当于持久化的过程
    • zTree.js fortunatelys
      zTree简介树形控件的使用是应用开发过程中不可少的，zTree是一个依靠jQuery实现的多功能“树插件”，优异的性能，灵活的配置，多功能的组合是zTree最大的优点。zTree的特点•最新版的zTree将核心代码按照功能进行了分割，不需要的代码可以不用加载，如普通使用只需要加载核心的jqurey.ztree.exedit-3.5.min.js•采用了延迟加载技术，上万节点轻松加载，即使在IE6
    • ztree 实现树同级拖动、节点删除、保存结构 前端ztree
      ztree.js如何实现树结构顺序的实时存储，经过和后端一番的讨论后，最终定下了在触发拖动的时候调用接口存储同级下的节点顺序，并且只能同级拖动：functionbeforeDrop(treeId,treeNodes,targetNode,moveType){varmoveNode=treeNodes[0];switch(moveType){case"prev":case"next":if(move
    • ztree.js 树组件 节点间距样式调整 洛阳醉长安行 ztree前端css
      树节点间距太窄了很紧凑需要css调整一下/*树形图间距*/.ztreelispan{font-size:14px;}.ztreelia{vertical-align:sub;}.ztreelispan.button.center_docu{background-position:-56px-10px;height:30px;}.ztreelispan.button.bottom_docu{back
    • ztree.js 树组件 节点间距样式调整 洛阳醉长安行 ztree前端css
      树节点间距太窄了很紧凑需要css调整一下/*树形图间距*/.ztreelispan{font-size:14px;}.ztreelia{vertical-align:sub;}.ztreelispan.button.center_docu{background-position:-56px-10px;height:30px;}.ztreelispan.button.bottom_docu{back
    • zTree.js(1) fortunatelys
      zTree是利用jQuery的核心代码，实现一套能完成大部分常用功能的Tree插件先来看下我们想要实现的效果哦5495490-21a2a0ebecbcd093.png部分函数和属性介绍】核心参数：settingvarsetting={view:{showIcon:false},data:{simpleData:{enable:true,idKey:"id",pIdKey:"pid"}},edit:
    • zTree.js 异步加载地区例子 java的爪哇 js
      后台实现可以参考我以前发表的文章地区三级联动zTreeAPIjs下载点击打开链接一个效果demoZTREEDEMO-selectmenu-->varsetting={async:{enable:true,url:"/area/getAreas.do",autoParam:["id=code"],//autoParam:["id","name=n","level=lv"],//otherParam:
    • Uncaught TypeError: Cannot read property 'init' of undefined hdn_kb 入坑解决方法js
      在工作中有一次遇到了前端控制台报错的问题：这是我在使用zTree属性结构插件的时候遇到的问题，主要原因是：我在引入js的时候，将zTree.js放在了jquery.js的前面所导致的。解决办法：将jquey.js文件放在最前面即可。因此，我们在引入js文件的时候，如果需要引用jquery.js，则一定一定要把jquey.js文件放在做前面。
    • ztree.js构型树插件基于Java后台的异步加载问题 ElementABC
      最近在项目中用到了ztree.js这个构型树插件，因为我们公司使用的是Java开发后台，在插件的异步加载上和官方文档有些差异，所以自己总结了一下使用经验。一、ztree.js简介zTree是一个依靠jQuery实现的多功能“树插件”。优异的性能、灵活的配置、多种功能的组合是zTree最大优点。zTree是开源免费的软件（MIT许可证）。zTreev3.0将核心代码按照功能进行了分割，不需要的代码可
    • jquery的树组件ztree.js基本用法 阿拉斯加南海岸线
      项目中经常会用到下图所示的组织树，今天仔细研究下官方文档，在这里把一些入门的技巧记录下来。[图片上传失败...(image-b1fd92-1548556294996)]【简介】zTree是一个依靠jQuery实现的多功能“树插件”。形式多样，功能强大。配置方式采用jQuery与JSON的语法结构，参数配置简单，较易上手。兼容IE、FireFox、Chrome、Opera、Safari等浏览器，即使
    • zTree学习笔记 hello_doctor 学习笔记
      记录一下zTree的使用1，先导入需要的文件，我的demo是基于3.1的版本的，文件目录如下ztree.all导入了以后，剩下的三个可以不导入。all就是把另外三个集合一起了zTreeStyle文件下面是ztree需要的css和图片。这些东西都在ztree的开发包里面ztree.js是我自己写的js文件。ztree.jsp是数据显示页面。2，ztree.jsp导入需要的文件，定义放ztree的容器
    • 使用ztree.js，受益一生，十分钟学会使用tree树形结构插件 风间影月
      看到ztree.js，这几个字眼，毋庸置疑，那肯定就是tree树形结构了，曾经的swing年代有jtree，后来jquery年代有jstree和treeview，虽然我没写过，但是我见过，一些小功能做起来比较繁琐，几个功能做了一个月，当然了有能力的关系，也有插件易用度的关系最近要实现的功能用tree树形结构来做是最好的，就是资源的分配，来简单讲讲ztree吧，这是目前国内很火的一个插件，百度一下就
    • JQuery-zTree.js使用范例 TyCoding
      JQuery-zTree.js使用范例实现Tree树的插件很多，比如常见的UI：Layui、ElementUI、iView...。这里我们介绍一个小巧的构建Tree树的插件zTree.jszTree.js官网API介绍的灰常详细了，这里我们实战使用zTree.js构建一棵Tree树。写在前面下列文章中讲述的实例，需要使用的后端数据是已经查询好的，这里我们不讲怎么查询数据，只讲如何使用现有的数据构建
    • ztree.js使用心得 麦子_FE
      varsetting={//节点是否显示checkboxcheck:{//是否显示checkboxenable:true},edit:{//工具enable:true,showRemoveBtn:true,showRenameBtn:false},callback:{//回调beforeRemove:_this.onRemove,//这里是是指针指向onRemove删除事件onClick:_thi
    • JQuery-zTree.js使用范例 星火卓越
      JQuery-zTree.js使用范例实现Tree树的插件很多，比如常见的UI：Layui、ElementUI、iView...。这里我们介绍一个小巧的构建Tree树的插件zTree.jszTree.js官网API介绍的灰常详细了，这里我们实战使用zTree.js构建一棵Tree树。写在前面下列文章中讲述的实例，需要使用的后端数据是已经查询好的，这里我们不讲怎么查询数据，只讲如何使用现有的数据构建
    • webpack4+node合并资源请求, 实现combo功能(二十三) 龙恩0707
      本文学习使用nodejs实现css或js资源文件的合并请求功能，我们都知道在一个复杂的项目当中，可能会使用到很多第三方插件，虽然目前使用vue开发系统或者h5页面，vue组件够用，但是有的项目中会使用到类似于echarts这样的插件，或者第三方其他的插件，比如ztree.js这样的，那如果我们把所有js都打包到一个js文件当中，那么该js可能会变得非常大，或者我们可能会把他们单独打包一个个js文件
    • jQuery树插件zTree.js如何应用后台返回的不标准数据 u011500781
      应用zTree插件，有2种数据格式，一种是标准数据，一种是简单数据，具体请看下面不能直接应用的数据示例：1. 后台返回标准json数据但是不能直接应用：原因：应用ztree，json数据必须要有name和children字段，参见：view-source:http://www.treejs.cn/v3/demo/cn/core/standardData.html不能直接应用数据如下：{ "code
    • zTree使用 爱做梦的鱼
      html内容：  zTree.js内容：//从后台接收zTreejson格式数据，通过ajax加载到前台，默认展开根节点 $(document).ready(function(){ //加载并初始化Ztree zTree_init(); //提交数据到后台 $("#click").click(function(){ vartreeObj=$.fn.zTre
    • jquery 的一个诡异错误“Uncaught TypeError: Object # has no method 'toLowerCase'” jquery
      今天上头说ztree.js 这个控件似乎有点问题，树展开了不能缩回去， 我感觉应该是js 的问题，打开浏览器，开启调试，发现如下错误   google后无解，一步一步排查，发现将下列代码删除后正常     <dl> <dt>节点名称</dt>
    • ztree “Uncaught TypeError: Object # has no method 'toLowerCase'” z69183787 ztree
      今天上头说ztree.js这个控件似乎有点问题，树展开了不能缩回去，我感觉应该是js的问题，打开浏览器，开启调试，发现如下错误 google后无解，一步一步排查，发现将下列代码删除后正常   节点名称 节点状态 慢慢找原因，最后发现是这个id的命名似乎与jquery有冲突   “nodeName”换成"theNodeName"后，ztree.js就可以顺利collapse了
    • Algorithm 香水浓 javaAlgorithm
      冒泡排序 public static void sort(Integer[] param) { for (int i = param.length - 1; i > 0; i--) { for (int j = 0; j < i; j++) { int current = param[j]; int next = param[j + 1];
    • mongoDB 复杂查询表达式 开窍的石头 mongodb
      1:count    Pg: db.user.find().count();    统计多少条数据 2:不等于$ne    Pg: db.user.find({_id:{$ne:3}},{name:1,sex:1,_id:0});    查询id不等于3的数据。 3：大于$gt $gte(大于等于) &n
    • Jboss Java heap space异常解决方法, jboss OutOfMemoryError : PermGen space 0624chenhong jvmjboss
      转自 http://blog.csdn.net/zou274/article/details/5552630 解决办法： window->preferences->java->installed jres->edit jre 把default vm arguments 的参数设为-Xms64m -Xmx512m ----------------
    • 文件上传 下载 解析 相对路径 不懂事的小屁孩 文件上传
      有点坑吧，弄这么一个简单的东西弄了一天多，身边还有大神指导着，网上各种百度着。 下面总结一下遇到的问题： 文件上传，在页面上传的时候，不要想着去操作绝对路径，浏览器会对客户端的信息进行保护，避免用户信息收到攻击。 在上传图片，或者文件时，使用form表单来操作。 前台通过form表单传输一个流到后台，而不是ajax传递参数到后台，代码如下: <form action=&
    • 怎么实现qq空间批量点赞 换个号韩国红果果 qq
      纯粹为了好玩！！ 逻辑很简单 1 打开浏览器console；输入以下代码。 先上添加赞的代码 var tools={}; //添加所有赞 function init(){ document.body.scrollTop=10000; setTimeout(function(){document.body.scrollTop=0;},2000);//加
    • 判断是否为中文 灵静志远 中文
      方法一： public class Zhidao { public static void main(String args[]) { String s = "sdf灭礌 kjl d{';\fdsjlk是"; int n=0; for(int i=0; i<s.length(); i++) { n = (int)s.charAt(i); if((
    • 一个电话面试后总结 a-john 面试
      今天，接了一个电话面试，对于还是初学者的我来说，紧张了半天。 面试的问题分了层次，对于一类问题，由简到难。自己觉得回答不好的地方作了一下总结：   在谈到集合类的时候，举几个常用的集合类，想都没想，直接说了list,map。   然后对list和map分别举几个类型：   list方面：ArrayList,LinkedList。在谈到他们的区别时，愣住了
    • MSSQL中Escape转义的使用 aijuans MSSQL
      IF OBJECT_ID('tempdb..#ABC') is not null drop table tempdb..#ABC create table #ABC ( PATHNAME NVARCHAR(50) ) insert into #ABC SELECT N'/ABCDEFGHI' UNION ALL SELECT N'/ABCDGAFGASASSDFA' UNION ALL
    • 一个简单的存储过程 asialee mysql存储过程构造数据批量插入
                 今天要批量的生成一批测试数据，其中中间有部分数据是变化的，本来想写个程序来生成的，后来想到存储过程就可以搞定，所以随手写了一个，记录在此：            DELIMITER $$ DROP PROCEDURE IF EXISTS inse
    • annot convert from HomeFragment_1 to Fragment 百合不是茶 android导包错误
      创建了几个类继承Fragment, 需要将创建的类存储在ArrayList<Fragment>中; 出现不能将new 出来的对象放到队列中,原因很简单;     创建类时引入包是:import android.app.Fragment;      创建队列和对象时使用的包是:import android.support.v4.ap
    • Weblogic10两种修改端口的方法 bijian1013 weblogic端口号配置管理config.xml
      一.进入控制台进行修改    1.进入控制台:  http://127.0.0.1:7001/console     2.展开左边树菜单         域结构->环境->服务器-->点击AdminServer(管理) &
    • mysql 操作指令 征客丶 mysql
      一、连接mysql 进入 mysql 的安装目录； $ bin/mysql -p [host IP 如果是登录本地的mysql 可以不写 -p 直接 -u] -u [userName] -p 输入密码，回车，接连； 二、权限操作［如果你很了解mysql数据库后，你可以直接去修改系统表，然后用 mysql> flush privileges; 指令让权限生效］ 1、赋权 mys
    • 【Hive一】Hive入门 bit1129 hive
      Hive安装与配置 Hive的运行需要依赖于Hadoop，因此需要首先安装Hadoop2.5.2，并且Hive的启动前需要首先启动Hadoop。   Hive安装和配置的步骤   1. 从如下地址下载Hive0.14.0   http://mirror.bit.edu.cn/apache/hive/    2.解压hive，在系统变
    • ajax 三种提交请求的方法 BlueSkator Ajaxjqery
      1、ajax 提交请求 $.ajax({ type:"post", url : "${ctx}/front/Hotel/getAllHotelByAjax.do", dataType : "json", success : function(result) { try { for(v
    • mongodb开发环境下的搭建入门 braveCS 运维
        linux下安装mongodb 1）官网下载mongodb-linux-x86_64-rhel62-3.0.4.gz 2）linux 解压  gzip -d mongodb-linux-x86_64-rhel62-3.0.4.gz; mv mongodb-linux-x86_64-rhel62-3.0.4 mongodb-linux-x86_64-rhel62-
    • 编程之美-最短摘要的生成 bylijinnan java数据结构算法编程之美
      import java.util.HashMap; import java.util.Map; import java.util.Map.Entry; public class ShortestAbstract { /** * 编程之美 最短摘要的生成 * 扫描过程始终保持一个[pBegin,pEnd]的range,初始化确保[pBegin,pEnd]的ran
    • json数据解析及typeof chengxuyuancsdn jstypeofjson解析
      // json格式 var people='{"authors": [{"firstName": "AAA","lastName": "BBB"},' +' {"firstName": "CCC&
    • 流程系统设计的层次和目标 comsci 设计模式数据结构sql框架脚本
                                    流程系统设计的层次和目标  
    • RMAN List和report 命令 daizj oraclelistreportrman
      LIST 命令 使用RMAN LIST 命令显示有关资料档案库中记录的备份集、代理副本和映像副本的 信息。使用此命令可列出： • RMAN 资料档案库中状态不是AVAILABLE 的备份和副本 • 可用的且可以用于还原操作的数据文件备份和副本 • 备份集和副本，其中包含指定数据文件列表或指定表空间的备份 • 包含指定名称或范围的所有归档日志备份的备份集和副本 • 由标记、完成时间、可
    • 二叉树:红黑树 dieslrae 二叉树
          红黑树是一种自平衡的二叉树,它的查找,插入,删除操作时间复杂度皆为O(logN),不会出现普通二叉搜索树在最差情况时时间复杂度会变为O(N)的问题.     红黑树必须遵循红黑规则,规则如下     1、每个节点不是红就是黑。     2、根总是黑的  &
    • C语言homework3，7个小题目的代码 dcj3sjt126com c
      1、打印100以内的所有奇数。 # include <stdio.h> int main(void) { int i; for (i=1; i<=100; i++) { if (i%2 != 0) printf("%d ", i); } return 0; }  2、从键盘上输入10个整数，
    • 自定义按钮, 图片在上, 文字在下, 居中显示 dcj3sjt126com 自定义
      #import <UIKit/UIKit.h> @interface MyButton : UIButton -(void)setFrame:(CGRect)frame ImageName:(NSString*)imageName Target:(id)target Action:(SEL)action Title:(NSString*)title Font:(CGFloa
    • MySQL查询语句练习题，测试足够用了 flyvszhb sqlmysql
      http://blog.sina.com.cn/s/blog_767d65530101861c.html 1.创建student和score表 CREATE  TABLE  student ( id  INT(10)  NOT NULL  UNIQUE  PRIMARY KEY  , name  VARCHAR
    • 转：MyBatis Generator 详解 happyqing mybatis
        MyBatis Generator 详解 http://blog.csdn.net/isea533/article/details/42102297   MyBatis Generator详解 http://git.oschina.net/free/Mybatis_Utils/blob/master/MybatisGeneator/MybatisGeneator.
    • 让程序员少走弯路的14个忠告 jingjing0907 工作计划学习
        无论是谁，在刚进入某个领域之时，有再大的雄心壮志也敌不过眼前的迷茫：不知道应该怎么做，不知道应该做什么。下面是一名软件开发人员所学到的经验，希望能对大家有所帮助   1.不要害怕在工作中学习。 只要有电脑，就可以通过电子阅读器阅读报纸和大多数书籍。如果你只是做好自己的本职工作以及分配的任务，那是学不到很多东西的。如果你盲目地要求更多的工作，也是不可能提升自己的。放
    • nginx和NetScaler区别 流浪鱼 nginx
      NetScaler是一个完整的包含操作系统和应用交付功能的产品，Nginx并不包含操作系统，在处理连接方面，需要依赖于操作系统，所以在并发连接数方面和防DoS攻击方面，Nginx不具备优势。 2.易用性方面差别也比较大。Nginx对管理员的水平要求比较高，参数比较多，不确定性给运营带来隐患。在NetScaler常见的配置如健康检查，HA等，在Nginx上的配置的实现相对复杂。 3.策略灵活度方
    • 第11章 动画效果（下） onestopweb 动画
      index.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/
    • FAQ - SAP BW BO roadmap blueoxygen BOBW
      http://www.sdn.sap.com/irj/boc/business-objects-for-sap-faq   Besides, I care that how to integrate tightly.   By the way, for BW consultants, please just focus on Query Designer which i
    • 关于java堆内存溢出的几种情况 tomcat_oracle javajvmjdkthread
      【情况一】： 　　 java.lang.OutOfMemoryError: Java heap space：这种是java堆内存不够，一个原因是真不够，另一个原因是程序中有死循环； 　　如果是java堆内存不够的话，可以通过调整JVM下面的配置来解决： 　　<jvm-arg>-Xms3062m</jvm-arg> 　　<jvm-arg>-Xmx
    • Manifest.permission_group权限组 阿尔萨斯 Permission
      结构 继承关系 public static final class Manifest.permission_group extends Object java.lang.Object android. Manifest.permission_group 常量 ACCOUNTS 直接通过统计管理器访问管理的统计 COST_MONEY可以用来让用户花钱但不需要通过与他们直接牵涉的权限 D
    按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他