<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>头部编辑
</title>
<link rel="stylesheet" href="/layui/css/layui.css">
</head>
<body>
<div class="layui-layout layui-layout-admin">
<div id="header"></div>
<div id="side"></div>
<div class="layui-body" style="left: 250px; top: 100px;">
<button id="button">test</button>
<div id="test1"></div>
</div>
<div id="footer"></div>
</div>
<script src="/layui/layui.js"></script>
<script src="/js/jquery-3.2.1.js"></script>
<script>
var inst1
var tree
var myData = [{
title: 'ROOT' //一级菜单
, id: 1
, checked: false
}]
layui.use(['layer', 'form', 'element', 'tree'], function () {
var layer = layui.layer
, form = layui.form;
var element = layui.element;
tree = layui.tree;
var index=1;
inst1 = tree.render({
elem: '#test1' //绑定元素
, edit: ['add', 'update', 'del']
, data: myData
, id: 'myData'
, showCheckbox: false
, operate: function (obj) {
var type = obj.type; //得到操作类型：add、update、del
var data = obj.data; //得到当前节点的数据
var elem = obj.elem; //得到当前节点元素
if(type==='add'){
++index;
return index;
}else if(type==='update'){
console.log(JSON.stringify(data))
console.log(JSON.stringify(elem))
}else{
}
}
});
});
$('#header').load("/admin/html/header.html");
$('#side').load("/admin/html/side.html");
$('#footer').load("/html/footer.html");
$('#button').click(function () {
layer.msg(JSON.stringify(tree.getChecked('myData')))
})
</script>
<style>
#icon {
float: right;
}
.body {
bottom: 0;
}
</style>
</body>
</html>