Question

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

angular.js：13920TypeError：无法读取属性＆＃39; childNodes＆＃39;的未定义

这是标记：

<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配置似乎修复了错误。我还添加了一些其他东西（与原始问题无关）。

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);

Answer 2

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

在树节点config：

{ "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;
});

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

2 个答案: