隐藏部分单击 Dynatree 值

Question

有如下的树状结构

Section 1
item1
item2
Section 2
item5

我可以点击任何项目并使用 dynatree onActivate 函数和这段代码隐藏所有其他项目

  onActivate: function(node) {
            var resultId = "#" + node.data.title;
            resultId = resultId.replace(/\s/g, '');
            $('#contents>div').not(resultId).hide();
            $(resultId).show();
        },

我的html是这个

<div class="container-fluid text-left">
    <div class="row content">
        <div class="col-sm-2 sidenav" id="tree"> </div>
        <div class="col-sm-8" id="contents">

            <div id="item1">
                <table id="item1grid"></table>
            </div>
            <div id="item2">
                <table id="item2grid"></table>
            </div>
            <div id="item5">
                <table id="item5grid"></table>
            </div>
        </div>
        <div id="info"> </div>
    </div>
</div>
</div>

我如何扩展这个 html 和功能，所以如果我在树中单击 "Section 1" 它只显示该部分中的所有项目，即单击 "Section 1" 只显示 item1 和 item2

Answer 1

也许您可以通过使用 'onActivate' 回调的传入节点对象的一些属性来实现此目的。您需要检查激活的对象是否是一个文件夹，如果是，则显示该元素的所有子项。尝试将此代码段附加到您的 onActivate 回调中：

if (node.data.isFolder) {
    for (var i = 0; i < node.childList.length; i++) {
        $('#' + node.childList[i].data.key).show();
    }
}

随时使用 console.log 转储整个对象并检查您可以使用哪些字段。

你能提供一个 jsfiddle 来检查你到目前为止有什么吗？

隐藏部分单击 Dynatree 值

Hide Sections Clicking Dynatree Value

javascript

jquery

html

dynatree