最近在弄一个产品分类管理,是一个树形菜单的形式,用的是layui-tree ,由于它并没有动态添加节点,所以只能自己刚了。
大概效果如左图
具体的实现是当我鼠标移入“长袖”这个分类时,出现三个icon (如图),按“增加”按钮,会发送ajax异步请求到后台,在数据库库中增加以“长袖”为父类id 的一个子分类,成功后返回到前台,然后相应的节点下动态添加子节点,主要是通过append 来增加html元素
[html] view plain copy
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>多级分类管理</title>
- <meta name="renderer" content="webkit">
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
- <meta name="format-detection" content="telephone=no">
- <link rel="stylesheet" type="text/css"
- href="layui/css/layui.css" media="all">
- </head>
- <style>
- .panel {
- margin-bottom: 0;
- }
- i{
- cursor: pointer !important ;
- cursor: hand !important;
- }
- body{
- }
- a:hover{
- background-color:#E6E6E6 ;
- }
- .active{
- background:#E6E6E6;
- }
- .hide{
- display:none;
- }
- </style>
- <body style="height:100%;">
- <div style="height:100%;">
- <div class="panel panel-default"
- style="