【问题标题】:jsTree show/hide nodesjsTree 显示/隐藏节点
【发布时间】:2010-09-14 13:22:30
【问题描述】:

我正在使用 jstree,如果可能的话,我想知道如何隐藏/显示节点。我给列表项一个“cat”id 以使用 jquery 选择它们,但这不起作用。

这是代码。

html:

<div class="resultsContent">

    <div class="demo" id="demo_1">

    <ul>

    {% for ipc in ipcs %}

        {% ifequal ipc.back_list 1 %}   

            </ul></li>

        {% endifequal %}    

        {% ifequal ipc.kind "c" %}  

        <li id="{{ ipc.symbol }} cat" rel="node-type">
                {% else %}
                    <li id="{{ ipc.symbol }} cat" rel="node-type">
            {% endifequal %}
    {% endfor %}
    </ul>

</div>

</div>

脚本:

jQuery('#demo_1')

    .jstree({

        plugins : [ "themes", "html_data", "checkbox"  ], 

        themes : { theme: "default", dots : false, icons : false },         

        core : { "initially_open" : [ "{{ top_symbol }}" ] }, 

    })

$("#cat").slice(5, 10).hide(); //Hide some nodes 

【问题讨论】:

    标签: jquery html jstree


    【解决方案1】:

    在您的代码中,您似乎正在生成 li 元素,其 ID 由 IPC 符号值 plus 一个黑色空格,plus 单词“cat”组成。

    <li id="{{ ipc.symbol }} cat" rel="node-type">
    

    但是,您的选择器正在尝试获取 ID 正好是“猫”的元素

    $("#cat").slice(5, 10).hide(); //Hide some nodes 
    

    也许您可以使用不同的 jQuery 选择器。以Attribute Contains Selector为例:

    $("li[id*='cat']").slice(5, 10).hide(); //Hide nodes with the string 'cat'
    

    或者Attribute Contains Word Selector,在这种情况下更合适(因为你正在寻找一个完整的单词):

    $("li[id~='cat']").slice(5, 10).hide(); //Hide nodes containing the word 'cat'
    

    【讨论】:

    • 感谢 Tomás,我试过了,但似乎将“猫”放入 id 与 jstree 冲突。我将不得不以其他方式选择 li 元素。
    • 在这种情况下,尝试使用子选择器 (api.jquery.com/child-selector):选择 "demo_1" DIV 下的所有 LI 项:$('#demo_1 > li')
    • 我发了一个相关的question,你能看看吗?
    猜你喜欢
    • 2012-05-12
    • 2012-06-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多