eleTree树形插件引入
先放一个效果
刚开始用的xtree,不知为何总是达不到效果,不得已从layui官网插件中寻得这个eleTree插件,看着还不错,用法也简单。不过还是有点坑需要大家注意
开始使用:
引入css和js
layui/css/layui.css
layui/css/eleTree.css
layui/layui.js
动态数据使用示例
<script type="text/javascript">
layui.config({
base: "${pageContext.request.contextPath}/plugins/layui/lay/modules/" //eleTree.js所在目录
}).use(['jquery','eleTree'], function(){
var $ = layui.jquery;
var eleTree = layui.eleTree;
var json = ${menuTree};
eleTree.render({
elem: '.ele1',
data:json,
showCheckbox: true,
});
});
</script>
其中动态数据menuTree的数据如下:
[{"label":"用户","id":1,"children":[{"label":"网站用户","id":4,"data":[],"checked":false},{"label":"岗位管理","id":8,"data":[],"checked":false},{"label":"新增菜单","id":9,"data":[],"checked":false}]},{"label":"危险因素","id":5,"children":[{"label":"危险因素大类","id":6,"data":[],"checked":false},{"label":"危险因素类型","id":7,"data":[],"checked":true}]},{"label":"ceshi","id":10,"children":[]}]
eleTree.js和eleTree.css可通过官网的下载中中获取。为了便于大家下载,可直接点击我下载后上传到博客园的eleTree.rar。
我直接与layui官网下载的layui-v2.4.5版本合并在了一起,目录如下
eleTree树形插件引入的更多相关文章
- 插件使用一树形插件---zTree
zTree是一款挺好用的树形插件,中文文档齐全,demo丰富. 官方网站是 http://www.treejs.cn/v3/main.php#_zTreeInfo 源码网站 https://githu ...
- 这是用过的"最差"树形插件
这是用过的"最差"树形插件 !!! 或许大家听过一个bootstrap UI框架---ace皮肤.有兴趣的童鞋可以在线查看:https://www.iteblog.com/ac ...
- ztree树形插件
在开发项目中需要用到树插件,近期研究了几款树插件,好记性不如烂笔头 ,写下来 以后好查 MzTreeView(梅花雪) 很经典的树形菜单脚本控件 菜单树展示加载速度快 支持1w条以上大数据 缺点-- ...
- 【treeview】 基于jQuery的简单树形插件
[treeview] 效果图: 前几天想把后台的目录结构通过树形插件的方法反映到前端来,在网上搜了半天只找到了这个treeview,虽然不是很好看,不过还是够用的..用treeview的前提是要有jq ...
- github 码云 chrome文件树形插件
偶然间看到github有一个树形插件,对于代码层级较多的项目来说体验提升了很多 github的chrome插件 chrome商店: https://chrome.google.com/webstore ...
- Eclipse插件引入jar包的方法(转)
搞了两天,终于找到解决办法了.原来 Eclipse 插件项目引入外面的jar包不能用 build path---->add external jars的方法. 先说明两个概念:类加载器,O ...
- Eclipse插件引入jar包的方法
搞了两天,终于找到解决办法了.原来 Eclipse 插件项目引入外面的jar包不能用 build path---->add external jars的方法. 先说明两个概念:类加载器,O ...
- P3565 由简单的树形dp 引入 长链刨分
这道题感觉不太行 因为自己没想出来. 先说一下暴力吧,取三个点 让两两之间的距离相等怎么做呢,看起来是很复杂的样子的,但是仔细观察发现 答案出自一个点的儿子之间 或者儿子和父亲之间. 暴力枚举三个点然 ...
- Jquery之树形插件
1.DynaTree (推荐使用,说明文档以及样例在下载的压缩包里\doc\samples.html) DynaTree 是一个优化的动态jQuery树查看插件,它只在需要时才创建DOM元素.支持ch ...
随机推荐
- 工作中拓展的加密解密传输方式. DES对称加密传输.
系统间通过xml传输, 不能采用明文, 就加密传输. 秘钥(真正有效的是前8位)存储于配置中. public static string EncryptStr(this string content, ...
- GVIM 设置 vimrc
set expandtab set nobackup set nosmartindent set noautoindent set ruler au BufRead,BufNewFile *.sv s ...
- 获取geometry边界范围的示例代码
根据sqlserver geometry数据定义获取空间类型边界范围 --获取指定街道边界的xy最大最小值 ) '--街道编码 create table #temp_point(id int iden ...
- WordPress版微信小程序3.0版发布
距离WordPress版微信小程序上一个版本的发布过去了一个月了.在此间,我的工作有些变化,加上正在开发新版本,目前开源版的完善和升级稍稍有些滞后. 虽然这个版本是3.0版,期间有个过渡的2.8版,不 ...
- 命令纠正工具 thefuck 的简单使用
在unix系列的系统中,总会出现 命令拼写或者执行错误的情况, 比如 把 python 写成了pythou, cd 到一个不存在的目录,执行任务的权限 不够的问题, 这是心里 总是 在 fuck,但是 ...
- pandas数据结构之DataFrame操作
这一次我的学习笔记就不直接用官方文档的形式来写了了,而是写成类似于“知识图谱”的形式,以供日后参考. 下面是所谓“知识图谱”,有什么用呢? 1.知道有什么操作(英文可以不看) 2.展示本篇笔记的结构 ...
- Hive:map字段存储和取用 ( str_to_map函数 )
str_to_map(字符串参数, 分隔符1, 分隔符2) 使用两个分隔符将文本拆分为键值对. 分隔符1将文本分成K-V对,分隔符2分割每个K-V对.对于分隔符1默认分隔符是 ',',对于分隔符2默认 ...
- part1
一.hello world 明确的指出 hello.py 脚本由 python 解释器来执行.coding:utf-8处理脚本中的中文 #!/usr/bin/env python # _*_ codi ...
- NSIS 查找目录下的所有文件夹
在制作安装包的时候,需要查看下某一目录下的所有文件夹的名称.经过查资料发现需要用到NSIS 的一个插件Locate.下载该插件后,会在NSIS的安装目录 ...Program Files\NSIS\P ...
- UE4 多人网络对战游戏笔记
1.给物体施加一个径向力 定义一个径向力: URadialForceComponent* RadialForceComp; 在构造函数里赋默认值: RadialForceComp = CreateDe ...