如何使用内联 Json 加载 jstree？答案

【问题标题】：How can I load up jstree with inline Json?如何使用内联 Json 加载 jstree？
【发布时间】：2010-09-21 16:36:38
【问题描述】：

这是 jstree 代码：

 $("#tree").jstree({
          "json_data": {
              "data": treedata,
              "progressive_render": true
          },
          "plugins": ["themes", "json_data"]
      });

treedata 包含一些 Json。不幸的是，没有任何渲染。我发现的示例是用于 ajax 加载 Json，但我现在用内联 Json 来证明这个概念。它是有效的 Json，但 jstree 根本不渲染任何东西。

谁能告诉我我做错了什么？

“tree”是一个有效的<div>

【问题讨论】：

那个 jstree 看起来很危险。你看过在 Jit thejit.org/demos 中实现的 spacetree。在我对树可视化工具的研究中，我已经排除了 jstree。取决于您使用它的目的，但 Jit 使用内联 Json 进行了处理。

标签： javascript json jstree

【解决方案1】：

你的 treedata 是 json 还是 json 字符串？如果是json字符串需要先使用var treedata= $.parseJSON(treedatastring);。

我在当前页面中使用此代码并且它可以工作。我知道你说你的 json 是有效的，但你可能还是想发布它或者在这个 site 测试它

var jsonConverted = $.parseJSON(jsonData);
    $('#tree').jstree({
        "json_data": {
            "data": jsonConverted
        },
        "themes": {
            "theme": "default",
            "url": "/Content/Styles/Default/themes/default/style.css",
            "dots": false
        },
        "plugins": ["themes", "json_data", "ui", "crrm"]
    });

在哪里jsonData= '[{"attr": { "id": "someid"}, "data": { "title":"SomeTitle", "icon": "/Content/images/FolderIcon.png"}, "children":[]}]';

请确保您的单引号和双引号，因为它有很大的不同。

【讨论】：