layui-treetable
/
demo.html

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title></title>
    <meta name="description" content="">
    <meta name="keywords" content="">
    <link href="" rel="stylesheet">
    <link rel="stylesheet" href="layui/css/layui.css">
</head>

<body>
    <button class="layui-btn" id="expand">全部展开</button>
    <button class="layui-btn" id="collapse">全部收起</button>
    <div id="demo"></div>
</body>
<script src="layui/layui.js"></script>
<script type="text/javascript">

var layout = [
    { name: '菜单名称', treeNodes: true, headerClass: 'value_col', colClass: 'value_col', style: '' }
];

layui.use(['form', 'tree', 'layer'], function() {
    var layer = layui.layer, form = layui.form, $ = layui.jquery;

    var tree1 = layui.treeGird({
        elem: '#demo', //传入元素选择器
        spreadable: false, //设置是否全展开，默认不展开
        checkbox : true,
        nodes: [{
                "id": "1",
                "name": "父节点1",
                "children": [{
                        "id": "11",
                        "name": "子节点11"
                    },
                    {
                        "id": "12",
                        "name": "子节点12"
                    }
                ]
            },
            {
                "id": "2",
                "name": "父节点2",
                "children": [{
                    "id": "21",
                    "name": "子节点21",
                    "children": [{
                        "id": "211",
                        "name": "子节点211"
                    }]
                }]
            }
        ],
        layout: layout
    });

    form.render();

    $('#collapse').on('click', function() {
        layui.collapse(tree1);
    });

    $('#expand').on('click', function() {
        layui.expand(tree1);
    });

    form.on('checkbox(*)', function(data){
        console.log(data.elem); //得到checkbox原始DOM对象
        console.log(data.elem.checked); //是否被选中，true或者false
        console.log(data.value); //复选框value值，也可以通过data.elem.value得到
        console.log(data.othis); //得到美化后的DOM对象

        var arr = layui.getSelected(tree1);
        console.log(arr.length)
    });


});


</script>

</html>