Question

我对JSTree（https://www.jstree.com/）有一点问题。

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

以视觉方式，我需要做一些事情：

（ICON-ARROW-ACTION）NAME
（ICON-ARROW-ACTION）NAME 2
- （ICON-ARROW-ACTION）NAME 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();

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

Answer 1

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

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

JSTree - 添加操作以重定向

1 个答案: