JSTree - 添加动作到重定向答案

【问题标题】：JSTree - Add action to RedirectJSTree - 添加动作到重定向
【发布时间】：2018-01-22 17:27:11
【问题描述】：

我在使用 JSTree (https://www.jstree.com/) 时遇到了一点问题。

为了简化，我有一个项目树，我想在每个列出的项目的名称之前放置一个操作（使用 fontawesome 进入项目的操作），我已经知道如何使用 JS 进行重定向，但是JSTree 不允许我在树上插入此操作。

在视觉上我需要做一些类似的事情：

（图标-箭头-动作）名称
（图标-箭头-动作）名称 2
- （图标-箭头-动作）名称 3

我正在做这样的事情：

(HTML)

<div id="jstree_projects">
  <ul>
    <li data-jstree='{"opened":true}'>
      <i class="fa fa-arrow-right fa-fw redirect_project"
         data-url="<?= site_url('ON CLICK THIS ACTION, REDIRECT TO THIS URL'); ?>">
      </i>
      PROJECT NAME
      <ul>
        <li data-jstree='{"opened":true}'>
          <i class="fa fa-arrow-right fa-fw redirect_project"
             data-url="<?= site_url('ON CLICK THIS ACTION, REDIRECT TO THIS URL'); ?>">
          </i>
          PROJECT NAME 2
        </li>
      </ul>
    </li>
  </ul>
</div>

(CSS)

#jstree_projects{
  margin-top: 20px;
  width: 100%;
  overflow-x: auto;
}
.redirect_project{
  color: yellow;
  margin-right: 10px;
}

(JS)

$('#jstree_projects').jstree();

如果有人可以帮助我，我将不胜感激。

【问题讨论】：

标签： javascript jquery css jstree

【解决方案1】：

您可以使用select_node.jstree 事件。它将为您提供选定的node 对象及其相关数据。此外，您可以检查它是否具有属性children: [] 的列表中的最后一项。

我为你创建了一个jsFiddle，点击here。我所做的唯一更改是将data-url 属性移动到<li> 标记。

【讨论】：