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 相关文章推荐
Javascript在IE或Firefox下获取鼠标位置的代码
Dec 18 Javascript
js下通过prototype扩展实现indexOf的代码
Dec 08 Javascript
js中的值类型和引用类型小结 文字说明与实例
Dec 12 Javascript
js鼠标滑轮滚动事件绑定的简单实例(兼容主流浏览器)
Jan 14 Javascript
JavaScript中的关联数组问题
Mar 04 Javascript
JavaScript中style.left与offsetLeft的使用及区别详解
Jun 08 Javascript
jQuery实现的简单百分比进度条效果示例
Aug 01 Javascript
详解JavaScript RegExp对象
Feb 04 Javascript
Vue2.0利用vue-resource上传文件到七牛的实例代码
Jul 28 Javascript
详解javascript replace高级用法
Feb 17 Javascript
js获取 gif 的帧数的代码实例
Sep 10 Javascript
手动实现vue2.0的双向数据绑定原理详解
Feb 06 Vue.js
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 中文乱码解决办法总结分析
2009/07/30 PHP
PHP函数spl_autoload_register()用法和__autoload()介绍
2012/02/04 PHP
php中配置文件操作 如config.php文件的读取修改等操作
2012/07/07 PHP
是 WordPress 让 PHP 更流行了 而不是框架
2016/02/03 PHP
PHP空值检测函数与方法汇总
2017/11/19 PHP
php面试中关于面向对象的相关问题
2019/02/13 PHP
表格 隔行换色升级版
2009/11/07 Javascript
2010年最佳jQuery插件整理
2010/12/06 Javascript
jQuery实现的一个tab切换效果内部还嵌有切换
2014/08/10 Javascript
angular2使用简单介绍
2016/03/01 Javascript
微信公众号开发 实现点击返回按钮就返回到聊天界面
2016/12/15 Javascript
Taro集成Redux快速上手的方法示例
2018/06/21 Javascript
详解.vue文件中style标签的几个标识符
2018/07/17 Javascript
Vue监听数据渲染DOM完以后执行某个函数详解
2018/09/11 Javascript
React项目动态设置title标题的方法示例
2018/09/26 Javascript
react native基于FlatList下拉刷新上拉加载实现代码示例
2018/09/30 Javascript
VUE搭建手机商城心得和遇到的坑
2019/02/21 Javascript
一些可能会用到的Node.js面试题
2019/06/15 Javascript
vue中通过使用$attrs实现组件之间的数据传递功能
2019/09/01 Javascript
vue 更改连接后台的api示例
2019/11/11 Javascript
js判断在哪个浏览器打开项目的方法
2020/01/21 Javascript
Vue组件生命周期运行原理解析
2020/11/25 Vue.js
浅析Python中的多条件排序实现
2016/06/07 Python
Python内置函数——__import__ 的使用方法
2017/11/24 Python
tensorflow实现简单逻辑回归
2018/09/07 Python
使用python爬取微博数据打造一颗“心”
2019/06/28 Python
解决Django删除migrations文件夹中的文件后出现的异常问题
2019/08/31 Python
python反转列表的三种方式解析
2019/11/08 Python
触发器(trigger)的功能都有哪些?写出一个触发器的例子
2012/09/17 面试题
毕业生自荐书
2014/02/02 职场文书
《生命的药方》教学反思
2014/04/08 职场文书
社区工作者演讲稿
2014/05/23 职场文书
模范教师材料大全
2014/12/16 职场文书
十二生肖观后感
2015/06/12 职场文书
Python移位密码、仿射变换解密实例代码
2021/06/27 Python
react中useState使用:如何实现在当前表格直接更改数据
2022/08/05 Javascript