0

我一直在试验 jQuery.jsTree 库,需要一些帮助。请有人告诉我如何json_data从外部.json文件中读取。

$("#treeDemo").jstree({ 
    "plugins" : [ "themes", "json_data", "ui", "types" ],

    //"json_data": {
    //  "ajax" : {
    //      "url" : "Series.json"
    //  }
    //},

    "json_data" : {
        "data" : [{"data":"Series 1","children":[{"data":"Season 1","children":[{"data":"Episode 1.avi","attr":{"rel":"file"}},{"data":"Episode 2.avi","attr":{"rel":"file"}},{"data":"Episode 3.avi","attr":{"rel":"file"}}],"attr":{"rel":"folder"}},{"data":"Season 2","children":[{"data":"Episode 4.avi","attr":{"rel":"file"}},{"data":"Episode 5.avi","attr":{"rel":"file"}}],"attr":{"rel":"folder"}}],"attr":{"rel":"folder"}},{"data":"Series 2","children":[{"data":"Season 1","children":[{"data":"Episode 1.avi","attr":{"rel":"file"}},{"data":"Episode 2.avi","attr":{"rel":"file"}},{"data":"Episode 3.avi","attr":{"rel":"file"}},{"data":"Episode 4.avi","attr":{"rel":"file"}}],"attr":{"rel":"folder"}}],"attr":{"rel":"folder"}},{"data":"Series 3","children":[{"data":"Episode 1.avi","attr":{"rel":"file"}},{"data":"Episode 2.avi","attr":{"rel":"file"}}],"attr":{"rel":"folder"}},{"data":"Series 1","children":[{"data":"Episode 1.avi","attr":{"rel":"file"}}],"attr":{"rel":"folder"}},{"data":"Series 2","children":[{"data":"Episode 1.avi","attr":{"rel":"file"}},{"data":"Episode 2.avi","attr":{"rel":"file"}}],"attr":{"rel":"folder"}}]
    },

    "types" : {
        "max_depth" : -2,
        "max_children" : -2,
        "valid_children" : ["drive"],
        "types" : {
            "folder" : {
                "valid_children" : ["default", "folder"],
                "icon" : {
                    "image" : "images/folder.png"
                }
            },
            "file" : {
                "valid_children" : "none",
                "icon" : {
                    "image" : "images/file.png"
                }
            }
        }
    },

    "themes" : {
        "theme" : "default",
        "url" : "themes/default/style.css",
        "dots" : true,
        "icons" : true
    },

    "search" : {
        "case_insensitive" : true,
        "ajax" : {
            "url" : "/static/v.1.0pre/_docs/_search_result.json"
        }
    }

})

所以上面的代码就像 jsTree 一样工作。注释json_data插件假设从指定的“Series.json”文件中读取完全相同的 JSON 数据,但是,当代码运行时,只显示加载 gif。

请帮忙。

在此先感谢,格兰特

4

2 回答 2

1

这似乎是一个常见问题。无论如何,ajax请调用以获取所需的 json 文件,如下所示。

"json_data":{
    "ajax" : {
        "url" : "info.json"  // the URL to fetch the data. Use relative url if required
     }
}

这肯定会奏效!

干杯!

于 2013-08-03T05:00:21.133 回答
1

我刚刚尝试了上述示例,但它们对我不起作用。github示例代码中的以下内容可以正常工作:

$('#ajax').jstree({
    'core' : {
        'data' : {
            "url" : "./root.json",
            "dataType" : "json" // needed only if you do not supply JSON headers
        }
    }
});
于 2016-08-30T19:16:02.190 回答