在选择框中显示树结构数据--JQuery,jSon,Ajax

时间:2014-11-24 23:48:28

标签: javascript jquery ajax json

我想在" Ul"中显示嵌套数据。和" li"或框,但必须以树形结构显示。 所以在Json中,我正在接收文件夹结构,而且我不知道Json文件有多少文件夹级别。因此,我必须编写代码以从JSon文件中提取数据,并根据级别将数据显示为树结构。

我也不确定我的JSon文件应该是什么样子但我想出了这个示例JSon文件。 所以我需要的是,如果有人只是指出了正确的方向,为了实现功能,我需要创建什么样的JSon文件结构以及我的Ajax Jquery代码应该是什么样的

JSON文件

{
"folder": [
    {
    "id":"11"
    "name: "test1",
    "path": "site/test1",
    "children": [
        "12",
        "13"
        ]
    },
    {
    "id":"12",
    "name":"sub test1",
    "path":"site/test1/subtest1",
    "children":[
       "21"
       ]
    },
    {
    "id":"13",
    "name":"sub test 2",
    "path":"site/test1/subtest2",
    "children":[]
    },
    {
    "id":"21",
    "name":"sub sub test 1",
    "path":"site/test1/subtest1/subsubtest1",
    "children":[]
    },
    {
    "id":14",
    "name":"test2",
    "path":"site/test2",
    "children":[]
    }
  ]
}

示例JQUERY代码

$.ajax({
        dataType: "json",
        url: "http://localhost/web/folder.json",
        success: function(obj) {
           $.each(obj.folder, function (key, value) { // First Level
               console.log(value.name);
               $.each(value.children, function (k, v) {  // The contents inside stars
                   console.log(v);
               });
           });
        }
       });

0 个答案:

没有答案