1

我是 jsTree 的新手,我想在我的 HTML 页面中从 a<ul>和列表开始创建一棵树。<li>这个使用html_data插件(我希望它是正确的方法)。

我想知道:在 HTML 中写入将由 jsTree 变成树的数据的正确方法是什么?

jsTree 文档建议这样做:

<li>
    <a href="some_value_here">Node title</a>
    <!-- UL node only needed for children - omit if there are no children -->
    <ul>
        <!-- Children LI nodes here -->
    </ul>
</li>

但它没有指定将idjsTree 用来引用数据的属性放在哪里。

此外,它似乎并没有那么好用。我见过有人用 a<div>和 a<ul>标签嵌入该代码。例如:

<div id="categories">
    <ul>
        <li><a href="#">Category 1</a>
            <ul>
                <li><a href="#">SubCategory 1</a></li>
                <li><a href="#">SubCategory 2</a></li>
            </ul>
        </li>
        <li><a href="#">Category 2</a></li>
    </ul>
</div>

请注意,id在 div 标签中。这是正确的方法吗?对我来说,仅使用标签来编写节点的文本似乎不太舒服<a href="#">......如果我使用 a<span>我会松开项目图标......

希望有人比我的头脑更清晰。

4

1 回答 1

5

这似乎是 jsTree 用来绘制树的模式:

<div id="mytree">
    <ul>
        <li>
            <a href="#">Node 1</a>
            <ul>
                <li>
                    <a href="#">Node 1.1</a>
                </li>
                <li>
                    <a href="#">Node 1.2</a>
                    <ul>
                        <li>
                            <a href="#">Node 1.2.1</a>
                        </li>
                    </ul>
                </li>
            </ul>
        </li>
        <li>
            <a href="#">Node 2</a>
        </li>
    </ul>
</div>

也就是说,每个节点都具有 jsTree 文档推荐的结构:

<li>
    <a href="some_value_here">Node title</a>
    <!-- UL node only needed for children - omit if there are no children -->
    <ul>
        <!-- Children LI nodes here (recursively apply the same pattern)-->
    </ul>
</li>

并且所有结构都必须用(文档没有说明):

<div id="mytree">
    <ul>
        <!-- all the tree here -->
    </ul>
</div>
于 2011-01-14T07:56:18.153 回答