1

我想修改创建节点时创建的 DOM jstree。以编程方式创建节点时,jstree 创建 <li><a ../></li>. 我想将其包装成 a<span><a ../> more content</span>但我不知道如何自定义 jstree 创建的 DOM。

初始 jstree 的创建很简单(带有一些虚拟数据):

$("#tree").jstree({
        "json_data": {
            "data": {
                "data": "TE-CON",
                "metadata": {
                    "id": 23
                },
                "children": [
                    {
                        "data": "Node 1",
                        "children": [ "Node1.1", "Node1.2" ]
                    },
                    "TE-CON"
                ]

            }},
        "plugins": [ "themes", "json_data", "grid" ]
    });

这将创建一个 DOM:

<li class="jstree-last jstree-open">
<ins class="jstree-icon">&nbsp;</ins>
    <a href="#"><ins class="jstree-icon"></ins>TE-CON</a>

    <ul style="">
        <li class="jstree-open">
            etc...

而不是<a href="#"><ins class="jstree-icon"></ins>TE-CON</a>创建的,我想<span><a href="#"><ins class="jstree-icon"></ins>TE-CON</a></span>在 span 块中添加一些额外的 HTML。

4

1 回答 1

0

您可以采用与您提到的相同的方式如果您从服务器静态创建了一个元素。但是,如果您已动态创建元素,则必须在创建节点后执行操作,如下所示:

var node = $.jstree._reference('#demo1').create_node(
 node, 'last', data, false, false
);
var newnode = node.children().last();

node.append('<input type="text" ></input>');

还有另一种方法是按照此链接使用 html_titles https://stackoverflow.com/a/5059969/2547372

于 2013-07-03T16:39:16.387 回答