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 相关文章推荐
让您的菜单不离网站
Oct 03 Javascript
IE iframe的onload方法分析小结
Jan 07 Javascript
javascript插入样式实现代码
Feb 22 Javascript
验证控件与Button的OnClientClick事件详细解析
Dec 04 Javascript
关于function类中定义变量this的简单说明
May 28 Javascript
jQuery插件ImgAreaSelect实现头像上传预览和裁剪功能实例讲解一
May 26 jQuery
Vue中定义全局变量与常量的各种方式详解
Aug 23 Javascript
Node.JS段点续传:Nginx配置文件分段下载功能的实现方法
Mar 12 Javascript
koa上传excel文件并解析的实现方法
Aug 09 Javascript
countUp.js实现数字动态变化效果
Oct 17 Javascript
vue-cli3.X快速创建项目的方法步骤
Nov 14 Javascript
详解微信小程序之提高应用速度小技巧
Jan 07 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开发需要注意的安全问题
2010/09/01 PHP
深入浅析php中sprintf与printf函数的用法及区别
2016/01/08 PHP
thinkPHP中多维数组的遍历方法
2016/01/09 PHP
De facto standard 世界上不可思议的事实标准
2010/08/29 Javascript
js禁止页面复制功能禁用页面右键菜单示例代码
2013/08/29 Javascript
jQuery实现列表自动循环滚动鼠标悬停时停止滚动
2013/09/06 Javascript
改变文件域的样式实现思路同时兼容ie、firefox
2013/10/23 Javascript
js+canvas实现滑动拼图验证码功能
2018/03/26 Javascript
通过vue.extend实现消息提示弹框的方法记录
2021/01/07 Vue.js
javascript实现点击产生随机图形
2021/01/25 Javascript
Mac下Supervisor进程监控管理工具的安装与配置
2014/12/16 Python
详解Python各大聊天系统的屏蔽脏话功能原理
2016/12/01 Python
Tornado协程在python2.7如何返回值(实现方法)
2017/06/22 Python
简述:我为什么选择Python而不是Matlab和R语言
2017/11/14 Python
python 输入一个数n,求n个数求乘或求和的实例
2018/11/13 Python
python调用c++传递数组的实例
2019/02/13 Python
python 实现12bit灰度图像映射到8bit显示的方法
2019/07/08 Python
python 实现turtle画图并导出图片格式的文件
2019/12/07 Python
tensorflow pb to tflite 精度下降详解
2020/05/25 Python
python修改微信和支付宝步数的示例代码
2020/10/12 Python
Cpython解释器中的GIL全局解释器锁
2020/11/09 Python
美国波西米亚风格精品店:South Moon Under
2019/10/26 全球购物
AJax面试题
2014/11/25 面试题
网络工程师的自我评价
2013/10/02 职场文书
法学专业毕业生自荐信范文
2013/12/18 职场文书
《小山羊和小灰兔》教学反思
2014/02/19 职场文书
广告词串烧
2014/03/19 职场文书
新年团拜会主持词
2014/04/02 职场文书
《春晓》教学反思
2014/04/20 职场文书
招股说明书范本
2014/05/06 职场文书
工会换届选举方案
2014/05/21 职场文书
科级干部群众路线教育实践活动个人对照检查材料
2014/09/19 职场文书
python 如何在list中找Topk的数值和索引
2021/05/20 Python
Python机器学习实战之k-近邻算法的实现
2021/11/27 Python
MySQL使用IF语句及用case语句对条件并结果进行判断 
2022/09/23 MySQL
TypeScript实用技巧 Nominal Typing名义类型详解
2022/09/23 Javascript