javascript - 在 json_data 加载后更改 jsTree 节点 css 类?

标签 javascript jquery jstree

每当用户单击文件夹旁边的 [+] 时,我都会通过 json_data 加载我的 jsTree。我想要做的是将 css 类应用到某些节点以向用户突出显示它们。这里不是在谈论鼠标悬停或当前选择的节点,而是一些人稍后必须审查的多个节点。适当的 css 类已经在来自服务器的 JSON 响应中:

[
{"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-state-error”。 这是我的 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
    }
})

这行不通。我认为发生的是“成功:函数(n)”在树被加载之后被调用,但在它被绘制或准备好让 JQuery 找到选定的节点并应用我的类之前。 任何人都知道如何解决这个问题,或者在这种情况下可能有更好的方法将 css 类应用于 $("#node5 a")...?

最佳答案

我想我找到了解决方法。

    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]);
       }
    });

关于javascript - 在 json_data 加载后更改 jsTree 节点 css 类?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5813042/

相关文章:

Javascript 使用本地存储,回调对象并使用 Json 更改为字符串以在填充函数中使用

javascript - 防止在文本字段输入中键入,即使字段未被禁用/只读

javascript - Typed.js 动画闪烁光标不工作

javascript - 如何在 jQuery 中创建动态表?

jquery - 禁用 JStree 中的所有复选框

jquery - 如何取消选择 JSTree 中的所有节点

javascript - 大于在小于 100 的数字上返回错误值。Javascript

javascript - 更改传单标记图标

jquery - 为不同节点类型配置jstree右键上下文菜单

javascript - 在任意给定间隔内查找数组中 5 个最大数字的有效方法