jsTree 节点中的锚标记生成错误

Question

我尝试在 li 标签中添加锚标签，但它产生了以下错误，这让我抓狂。我假设这是因为 jsTree 会自动在 li 标签下添加一个锚标签，因此，我将一个锚放在一个锚中。

angular.js:13920TypeError: Cannot read property 'childNodes' of undefined

这是标记：

<div id="jstree_dbs_div">
     <ul>
         {% for type in types %}
             <li data-jstree='{"checkbox_disabled":true}'>
                 {{ type['parent']['text'] }} <span><a href="#">edit</a></span>
             </li>
         {% endfor %}
     </ul>
</div>

如果我删除那个锚标签，它工作正常（即没有错误）。

这是 jsTree 配置：

$jsTree.jstree({
    "core": {
        multiple: false,
    },
    "conditionalselect": function (node, event) {
        return false;
    },
    "plugins" : [ "wholerow", "checkbox", "conditionalselect" ],
    "checkbox": { cascade: "", three_state: false },
}).on("ready.jstree", function() {
    $jsTree.jstree('open_all');
}).on("select_node.jstree", function (e, data) {
    var href = data.node.a_attr.href;
    document.location.href = href;
});

Answer 1

只要您可以控制 jsTree 节点内的标记，我就没有发现添加此功能的问题。即使 jsTree 不允许您获得嵌入式 link，您仍然可以使用常规 javascript 实现它，如下所示，同时查看演示 - Fiddle Demo。但是，它不是Angular。

在树节点配置中：

{ "id": ..., 
  "parent": ..., 
  "text": "Text before link<a class='link' href='www.google.com'>google.com</a>" 
}

然后在事件处理程序中：

.on("select_node.jstree", function (e, data) {
    var href = $(data.event.currentTarget).find('.link').attr('href');
    document.location.href = href;
});

Answer 2

超时包装我的 jsTree 配置似乎修复了错误。我还添加了一些其他的东西（与原来的问题无关）。

setTimeout(function(){
    $jsTree = $('#jstree_dbs_div');

    $jsTree.jstree({
        "core": {
            multiple: false,
        },
        "conditionalselect": function (node, event) {
            var href = event.target.href;
            document.location.href = href;

            return false;
        },
        "plugins" : [ "wholerow", "checkbox", "conditionalselect" ],
        "checkbox": { cascade: "", three_state: false },
    }).on("ready.jstree", function() {
        $jsTree.jstree('open_all');
    });
}, 0);

jsTree 节点中的锚标记生成错误

Anchor tag(s) in jsTree node generating error

html

javascript

jquery

jstree

angularjs