在json_data加载后更改jsTree节点css类？

无论何时用户单击文件夹旁边的[+]，我都会通过json_data加载我的jsTree。我想要做的是将css类应用于某些节点，以便为用户突出显示它们。不是在讨论鼠标悬停或当前选定的节点，而是稍后人们必须查看的多个节点。相应的CSS类是已经从服务器JSON响应里面：在json_data加载后更改jsTree节点css类？

[ 
{"attr":{"id":"node_5","rel":"document","page_id":"4"},"data":"Test123","csscl":"ui-state-error","state":""}, 
{"attr":{"id":"node_6","rel":"folder","page_id":"6"},"data":"Services","csscl":"","state":"closed"} 
]

我“Test123”节点应该得到一流“的UI状态错误”后面的树。这里是我的jsTree：

$(function() { 
// Settings up the tree. note to self: dont use the cookie plugin here, this will always overwrite pre-selected nodes 
$("#jstree").jstree({ 
    "plugins" : [ "themes", "json_data", "ui", "types", "hotkeys",], 
    "json_data" : { 
     "ajax" : { 
      "url" : "inc/tree_server.php", 
      "data" : function (n) { 
       return { 
        "operation" : "get_children", 
        "id" : n.attr ? n.attr("id").replace("node_","") : 1 
       }; 
      }, 
      success: function(n) { 

       for (var i in n) 
       { 
        jqid = "#"+n[i].attr["id"]+" a"; 
        $(jqid).addClass(n[i].csscl); 
       }     
      } 
     } 
    }, 
    // the UI plugin 
    "ui" : { 
     // selected onload 
     "initially_select" : [ "node_<?=$p->oTopic->iId;?>" ] 
    }, 
    // the core plugin 
    "core" : { 
     "initially_open" : [ <?=$p->oTopic->sJstreeOpenSeq;?> ], 
     "animation" : 0 
    } 
})

这是行不通的。我认为会发生的事情是，在树加载之后调用“success：function（n）”，但在绘制或准备好让JQuery找到所选节点并应用我的类之前调用它。任何人都知道如何解决这个问题，或者在这种情况下，有更好的方法将css类应用于$（“＃node5 a”）......？

来源

2011-04-28 iHaveacomputer

你试过jsTree讨论组在http://groups.google.com/group/jstree？ – Radek 2011-07-27 07:46:06

你可以将它设置在“数据”对象吗？ “attr”：{“class”：“csscl”}？看看这里的第一个演示。 http://www.jstree.com/documentation/json_data – 2011-10-11 13:51:23

我想我找到了解决方法。

success: function(n) { 
     for (var i in n) 
     { 
      some_global_array_id.push(n[i].attr["id"]); 
      some_global_array_data.push(n[i].csscl); 
     }     
    }

然后加载后和绘图你可以调用函数是这样的：

$("#jstree").jstree({ 
     // ... code you posted 
    }).bind("reopen.jstree", function (e, data) { 
     for (var i in some_global_array_id) { 
      $("#"+some_global_array_id[i]+" a").addClass(some_global_array_data[i]); 
     } 
    });

来源

2011-11-22 10:32:06 ink

可以做得更容易，请看下面我的评论 – 2013-06-07 08:13:53

这是可以做到更容易。这种替换成功功能：

success: function(n) 
{ 
    for(var i = 0; i < n.length; i++) 
    { 
     n[i].data.attr['class'] = n[i].csscl; 
    } 
    return n;   
}

来源

2012-07-27 18:14:38

最新版本的jstree的语法已经改变。请参阅此文档：http://www.jstree.com/docs/json/。它现在应该是：'n [i] .li_attr ['class']'或'n [i] .a_attr ['class']'。 – Ring 2014-04-14 15:57:52

在json_data加载后更改jsTree节点css类？

回答

相关问题