tree.js一款树形结构菜单自带多级菜单的js插件，适合文件夹管理-BFW插件库

tree.js一款树形结构菜单自带多级菜单的js插件，适合文件夹管理

tree.js一款树形结构自带多级菜单的js插件，适合文件夹管理

第一步引入bfwone

第二步执行插件代码

示例如下

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <script id="bfwone" type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/bfwone.js"></script>
    <script type="text/javascript">
        var folerimg = "//repo.bfw.wiki/bfwrepo/image/folder.png";
        var fileimg = "//repo.bfw.wiki/bfwrepo/image/file.png";
        var folder_arr = "//repo.bfw.wiki/bfwrepo/image/folder_arr.png";
        var folder_arr_down = "//repo.bfw.wiki/bfwrepo/image/folder_arr_down.png";
        var tree;
        var contex_menu = {
            'context': {
                opennode: function(node) {
                    alert("双击效果")

                },
                foldermenu: [ {
                    type: "Common",
                    text: '新建',
                    icon: folerimg,
                    action: function(node) {

                        alert("新建效果")
                    },
                }],
                filemenu: [ {
                    type: "Common",
                    text: '删除',
                    icon: fileimg,
                    action: function(node) {

                        alert("删除效果")

                    }
                }, {
                    type: "Common",
                    text: '重命名',
                    icon: fileimg,
                    action: function(node) {
                        alert("重命名效果")
                    }

                }]
            }
        };

        bready(function() {
            use(["tree", "tree"], function() {

                tree = createTree("tree", 'black', contex_menu, folder_arr, folder_arr_down);

                var node1 = tree.createNode("文件夹", false,
                    folerimg, null,
                    "文件夹值", "context");
                var node3 = tree.createNode("文件夹4", false,
                    folerimg, node1,
                    "文件夹值4", "context");
                node3.createChildNode("文件5", false,
                    fileimg, "文5值",
                    "context");
                node1.createChildNode("文件1", false,
                    fileimg, "文件1值",
                    "context");
                node1.createChildNode("文件2", false,
                    fileimg, "文件2值",
                    "context");
                var node2 = tree.createNode("文件夹2", false,
                    folerimg, null,
                    "文件夹值2", "context");
                node2.createChildNode("文件3", false,
                    fileimg, "文件3值",
                    "context");
                tree.drawTree();
            });
        });
    </script>
</head>
<body>
    <div id="tree">

    </div>
</body>
</html>