展开/折叠 jQuery 树表答案

【问题标题】：Expand/Collapse jQuery treetable展开/折叠 jQuery 树表
【发布时间】：2018-01-25 13:52:36
【问题描述】：

我正在使用来自 jQuery 的 treetable 库，并且我正在尝试执行类似手风琴类型的行为，这样当我打开其中一个级别并展开时，我想折叠之前打开的另一个级别。我不知道如何使用 jQuery treetable 库来实现这种行为。

这是我的树表的代码：

function buildTreeTable(tree){

    $("#example").treetable({
        expandable:     true,
        onNodeExpand:   nodeExpand,
        onNodeCollapse: nodeCollapse
    });

function nodeExpand () {
        getNode(this.id); 
 }


function nodeCollapse () {
         console.log("Collapsed: " + this.id);
    }

function getNode(parentNode){
        id = parentNode;
        console.log("The new var is", id);
        console.log("The id of the parent is: ", parentNode);
        var parentNode = $("#example").treetable("node", parentNode);
        $("#example").treetable("unloadBranch", parentNode);
    console.log("parent node",parentNode);
}

提前致谢！

【问题讨论】：

Idea ...你可以保存你正在打开的节点的ID，然后你可以collapseAll（）然后展开你在变量.expandNode（id）中记住的ID。

标签： javascript jquery accordion treetable

【解决方案1】：

你可以试试这个：

最初折叠 Treegrid 表中的所有行。
然后，在'onExpand'函数中检查前一个节点是否被展开。如果它展开折叠该节点。（注意：我在这里将之前的 id 存储在 temp 变量中。）

现在，它可以像普通的“折叠和手风琴”一样正常工作

$(document).ready(function () {
    var temp = "";
    $('.tree').treegrid({
        'expanderExpandedClass': 'glyphicon glyphicon-minus',
        'expanderCollapsedClass': 'glyphicon glyphicon-plus',
        'initialState': 'collapsed',
        **'onExpand': function () {
            if ($(document.getElementById(temp)).treegrid('isExpanded')) {
                $(document.getElementById(temp)).treegrid('collapse');
            }
            temp = $(this).attr("id");
        }**
    });
});

【讨论】：