javascript - 节点内的可点击按钮

Question

TL;DR - 有没有办法在不使用 JS 重定向的情况下在 jsTree 节点中拥有工作链接？

---

我想在 jsTree 节点中添加按钮，如下所示:

我使用了这段代码:

$('#tree').jstree({
    'core': {
        'multiple': false,
        'themes': {
            'responsive': false
        }
    }
});

/* custom */
body {
    font: 14px/14px "Lucida Sans Unicode", "Lucida Grande", sans-serif normal;
}
.actions a {
    background: #333;
    color: #ccc;
    font-size: 11px;
    line-height: 18px;
    border-radius: 4px;
    padding: 0 5px;
    text-decoration: none;
}
.actions a:hover {
    background: #999;
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.0.9/themes/default/style.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jstree/3.0.1/jstree.min.js"></script>
<div id="tree">
    <ul>
        <li>
            <span class="content">Folder</span>
            <ul>
                <li>
                    <span class="content">Subfolder</span>
                    <ul>
                        <li>
                            <span class="content">File</span>
                            <span class="actions">
                                <a href="/open">open</a>
                                <a href="/delete">delete</a>
                            </span>
                        </li>
                    </ul>
                </li>
            </ul>
        </li>
    </ul>
</div>

我的问题是 jsTree 创建 <a>每个节点上的标签(出于语义目的)并拦截每个 click事件。我自己的 anchor 应该打开一个新页面，但现在没有任何反应。

作者推荐收听changed.jstree事件，并自己完成这项工作:

$('#tree').on('changed.jstree', function (e, data) {
    document.location = data.instance.get_node(data.selected[0], true).a_attr.href;
}).jstree();

如果我想使用 JS 重定向，这个解决方案是完全可以接受的。但我没有。
目前，我编辑了 jsTree 源代码以避免事件拦截(you can have a look on this rejected PR)，但就像作者提到的那样，这不是做这件事的好方法。所以这是我的最后一个问题:

有没有办法在不使用 JS 重定向的情况下在 jsTree 节点中拥有工作链接？

我愿意接受任何建议，我仍然可以使用它来捕获/触发事件，并且我的 HTML 标记可以重新组织。

Answer 1

你也可以试试这个:

$('#tree').on('ready.jstree', function () {
  $('#tree').off("click.jstree", ".jstree-anchor");
})