layui实现checkbox的目录树tree的例子


Posted in Javascript onSeptember 12, 2019

废话不多说啦,我就直接上代码吧,需要的朋友可以过来参考下

layui.use([ 'tree' ], function() {
$ = layui.jquery;
form = layui.form;
//获取节点数据
getTreeData();
});
 
function getTreeData()
{
$.ajax({
url : path+"/RoleController/getResourceTree.do",
type : "post",
dataType : "json",
data :{
"roleId":roleId,
"id":null,
"t":Math.random()
} ,
error : function() {
},
success : function(data) {
treeData = JSON.stringify(data);
initMenuTree();
}
});
}
 
// 加载列表
function initMenuTree() {
//json数姐转换成对象
treeData = eval( "(" + treeData + ")" );
//console.log(treeData);
// 执行渲染
treeIns = layui.tree({
elem: '#demo', //指定元素,生成的树放到哪个元素上
check: 'checkbox', //勾选风格
skin: 'as', //设定皮肤
drag: true,//点击每一项时是否生成提示信息
checkboxName: 'aa[]',//复选框的name属性值
checkboxStyle: "",//设置复选框的样式,必须为字符串,css样式怎么写就怎么写
click: function(item) { //点击节点回调
 //alert(item);
},
change: function (item){//当当前input发生变化后所执行的回调
//console.log(item);
resourceIds=item;
},
data: {//为元素添加额外数据,即在元素上添加data-xxx="yyy",可选
      hasChild: true
    },
nodes:treeData
});
return treeIns;
}

以上这篇layui实现checkbox的目录树tree的例子就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
web开发人员学习jQuery的6大理由及jQuery的优势介绍
Jan 03 Javascript
JQuery中extend使用介绍
Mar 13 Javascript
jquery 为a标签绑定click事件示例代码
Jun 23 Javascript
js中实现多态采用和继承类似的方法
Aug 22 Javascript
js变形金刚文字特效代码分享
Aug 20 Javascript
javascript显示系统当前时间代码
Dec 29 Javascript
vue高德地图之玩转周边
Jun 16 Javascript
使用vue根据状态添加列表数据和删除列表数据的实例
Sep 29 Javascript
JavaScript中this用法学习笔记
Mar 17 Javascript
解决vue-cli webpack打包开启Gzip 报错问题
Jul 24 Javascript
layuiAdmin循环遍历展示商品图片列表的方法
Sep 16 Javascript
node.js中stream流中可读流和可写流的实现与使用方法实例分析
Feb 13 Javascript
layui表单提交到后台自动封装到实体类的方法
Sep 12 #Javascript
使用flow来规范javascript的变量类型
Sep 12 #Javascript
LayUI数据接口返回实体封装的例子
Sep 12 #Javascript
浅谈layui 数据表格前后台传值的问题
Sep 12 #Javascript
layui框架与SSM前后台交互的方法
Sep 12 #Javascript
layui问题之渲染数据表格时,仅出现10条数据的解决方法
Sep 12 #Javascript
解决layui表格内文本超出隐藏的问题
Sep 12 #Javascript
You might like
php图片处理:加水印、缩略图的实现(自定义函数:watermark、thumbnail)
2010/12/02 PHP
基于MySQL体系结构的分析
2013/05/02 PHP
深入PHP nl2br()格式化输出的详解
2013/06/05 PHP
解析yii数据库的增删查改
2013/06/20 PHP
php文件操作之小型留言本实例
2015/06/20 PHP
详解PHP对数组的定义以及数组的创建方法
2015/11/27 PHP
教你php如何实现验证码
2016/01/20 PHP
PHP实现求两个字符串最长公共子串的方法示例
2017/11/17 PHP
javascript 不间断的图片滚动并可点击
2010/01/15 Javascript
cookie 最近浏览记录(中文escape转码)具体实现
2013/06/08 Javascript
jquery mobile事件多次绑定示例代码
2013/09/13 Javascript
js(jQuery)获取时间的方法及常用时间类搜集
2013/10/23 Javascript
javascript简单实现图片预加载
2014/12/03 Javascript
jQuery的load()方法及其回调函数用法实例
2015/03/25 Javascript
PassWord输入框代码分享
2016/06/07 Javascript
微信小程序-详解数据缓存
2016/11/24 Javascript
jQuery插件echarts实现的循环生成图效果示例【附demo源码下载】
2017/03/04 Javascript
Vue条件循环判断+计算属性+绑定样式v-bind的实例
2018/09/18 Javascript
Node.js中读取TXT文件内容fs.readFile()用法
2018/10/10 Javascript
原生JS实现逼真的图片3D旋转效果详解
2019/02/16 Javascript
Linux 发邮件磁盘空间监控(python)
2016/04/23 Python
python 检查数据中是否有缺失值,删除缺失值的方式
2019/12/02 Python
Python模块/包/库安装的六种方法及区别
2020/02/24 Python
浅谈Pytorch中的自动求导函数backward()所需参数的含义
2020/02/29 Python
django自定义非主键自增字段类型详解(auto increment field)
2020/03/30 Python
基于Python脚本实现邮件报警功能
2020/05/20 Python
Python数据相关系数矩阵和热力图轻松实现教程
2020/06/16 Python
Python中bisect的用法及示例详解
2020/07/20 Python
用python绘制樱花树
2020/10/09 Python
12月红领巾广播稿
2014/02/13 职场文书
陈欧广告词
2014/03/14 职场文书
入党现实表现材料
2014/12/23 职场文书
Python初学者必备的文件读写指南
2021/06/23 Python
python库sklearn常用操作
2021/08/23 Python
Linux中文件的基本属性介绍
2022/06/01 Servers