jquery文件菜单拓展《二》

$(document).ready(function() {
    // 初始化树形菜单
    $('#tree').treeview({
        data: getTree(), // 使用自定义函数获取树形数据
        levels: 2, // 只展开2级
        backColor:'white', // 背景色设置为白色
        showBorder:false, // 不显示边框
        showTags:true, // 显示标签
        // 节点被选中时的回调函数
        onNodeSelected: function(event, data) {
            // 在控制台输出选中节点的id和text
            console.log('Selected: ' + data.nodeId + ' - ' + data.text);
        },
        // 节点被取消选中时的回调函数
        onNodeUnselected: function(event, data) {
            // 在控制台输出取消选中节点的id和text
            console.log('Unselected: ' + data.nodeId + ' - ' + data.text);
        }
    });
});
 
// 自定义函数，用于获取树形数据
function getTree() {
    // 假设treeData是从服务器获取的数据
    var treeData = [
        {
            text: "Parent 1",
            href: "#parent1",
            tags: ["2"],
            nodes: [
                {
                    text: "Child 1",
                    href: "#child1",
                    tags: ["3"],
                    nodes: [
                        {
                            text: "Grandchild 1",
                            href: "#grandchild1",
                            tags: ["6"]
                        },
                        {
                            text: "Grandchild 2",
                            href: "#grandchild2",
                            tags: ["3"]
                        }
                    ]
                },
                {
                    text: "Child 2",
                    href: "#child2",
                    tags: ["3"]
                }
            ]
        },
        // ... 更多树节点数据
    ];
    return treeData;
}

这段代码示例展示了如何使用jQuery插件treeview来创建一个可拓展的树形菜单，并在节点被选中或取消选中时执行相应的操作。同时，它演示了如何从一个自定义函数中获取树形数据，这可以是静态的硬编码数据或者是从服务器动态加载的数据。