Jstree：使用自定义 div 创建节点答案

【问题标题】：Jstree : Create node with custom divJstree：使用自定义 div 创建节点
【发布时间】：2013-03-18 13:56:09
【问题描述】：

我使用插件 Jstree 来动态管理我的菜单。

我用一些 div 自定义了我的树来显示图标和链接：

<li rel="menu">
  <a class="js_menu_titre">
          <p class="jsmenu_titre_taille">Menu_Principal</p>
          <div class="jsmenu_lien">Link</div>
          <p class="jsmenu_icone">Actif : icon</p>
          <p class="jsmenu_action">Actions : icon_action</p>
  </a>

我的问题是，当我想使用函数 create node 时，我没有我的 div 了。我的海关 div 在链接内 ()

你可以在这里看到结果和问题：http://i71.servimg.com/u/f71/11/07/15/68/arbo10.jpg

我使用这个功能：

$("#jsmenu").bind("create.jstree", function (e, data) {
$.post(
    "/static/v.1.0pre/_demo/server.php", 
    { 
        "operation" : "create_node", 
        "id" : data.rslt.parent.attr("id").replace("node_",""), 
        "position" : data.rslt.position,
        "title" : data.rslt.name,
        "type" : data.rslt.obj.attr("rel")
    }, 
    function (r) {
        if(r.status) {
            $(data.rslt.obj).attr("id", "node_" + r.id);
        }
        else {
            $.jstree.rollback(data.rlbk);
        }
    }
);

})

对于我的添加按钮

function Ajouter() {
    $('#jsmenu').jstree("create", null, "last",{ "attr" : { "rel" : "folder" } });
}

【问题讨论】：

标签： javascript jquery tree jstree

【解决方案1】：

试试这样的：

$("#jsmenu").on("create_node.jstree", function (e, data) {
    $("li#"+data.node.id).find("a").append(html);
});

html 是一个包含您的图标代码的变量。

【讨论】：

你可以直接使用$("li#" + data.node.id + " > a")，而不是使用.find("a")。不过，我不知道它在性能方面有多好（在大多数情况下可能无关紧要）。也可以如Data Meister所说，直接通过id找到锚点。

【解决方案2】：

可以通过id直接访问锚点：

$("#jsmenu").on("create_node.jstree", function (e, data) { $("#"+data.node.id+"_anchor").append(html); });

【讨论】：