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 相关文章推荐
代码获取历史上的今天发生的事
Apr 11 Javascript
js获取select默认选中的Option并不是当前选中值
May 07 Javascript
js实现图片在未加载完成前显示加载中字样
Sep 03 Javascript
Javascript中使用A标签获取当前目录的绝对路径方法
Mar 02 Javascript
Bootstrap开发实战之第一次接触Bootstrap
Jun 02 Javascript
JS简单生成两个数字之间随机数的方法
Aug 03 Javascript
JS中对Cookie的操作详解
Aug 05 Javascript
js设置和获取自定义属性的方法
Oct 20 Javascript
解析Vue2 dist 目录下各个文件的区别
Nov 22 Javascript
vue获取data数据改变前后的值方法
Nov 07 Javascript
JS数组方法concat()用法实例分析
Jan 18 Javascript
elementui的el-popover修改样式不生效的解决
Jun 30 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
咖啡与水的关系
2021/03/03 冲泡冲煮
第五节--克隆
2006/11/16 PHP
MySQL连接数超过限制的解决方法
2011/07/17 PHP
如何取得中文字符串中出现次数最多的子串
2013/08/08 PHP
php preg_replace替换实例讲解
2013/11/04 PHP
php对数组排序的简单实例
2013/12/25 PHP
网页常用特效代码整理
2006/06/23 Javascript
JS类库Bindows1.3中的内存释放方式分析
2007/03/08 Javascript
javascript 基础篇2 数据类型,语句,函数
2012/03/14 Javascript
SwfUpload在IE10上不出现上传按钮的解决方法
2013/06/25 Javascript
JS中完美兼容各大浏览器的scrolltop方法
2015/04/17 Javascript
Javascript 数组去重的方法(四种)详解及实例代码
2016/11/24 Javascript
Vue+Webpack完美整合富文本编辑器TinyMce的方法
2018/11/30 Javascript
vue实现动态显示与隐藏底部导航的方法分析
2019/02/11 Javascript
JavaScript实现的弹出遮罩层特效经典示例【基于jQuery】
2019/07/10 jQuery
解决Vue router-link绑定事件不生效的问题
2020/07/22 Javascript
vue如何使用外部特殊字体的操作
2020/07/30 Javascript
[01:02:45]完美世界DOTA2联赛 LBZS vs Forest 第三场 11.07
2020/11/09 DOTA
使用FastCGI部署Python的Django应用的教程
2015/07/22 Python
最大K个数问题的Python版解法总结
2016/06/16 Python
flask中的wtforms使用方法
2018/07/21 Python
python执行CMD指令,并获取返回的方法
2018/12/19 Python
Python通过cv2读取多个USB摄像头
2019/08/28 Python
python垃圾回收机制(GC)原理解析
2019/12/30 Python
Python全局变量与global关键字常见错误解决方案
2020/10/05 Python
python批量生成条形码的示例
2020/10/10 Python
Python离线安装各种库及pip的方法
2020/11/28 Python
python利用pytesseract 实现本地识别图片文字
2020/12/14 Python
Microsoft新加坡官方网站:购买微软最新软件和技术产品
2016/10/28 全球购物
女大学生毕业找工作的自我评价
2013/10/03 职场文书
酒店门卫岗位职责
2013/12/29 职场文书
大学生入党积极分子自我评价
2014/09/20 职场文书
2014年城市管理工作总结
2014/12/02 职场文书
2014年人民调解工作总结
2014/12/08 职场文书
2014年工作总结及2015工作计划
2014/12/12 职场文书
成功的商业计划书这样写才最靠谱
2019/07/12 职场文书