首页 > 解决方案 > 如何使用 getJSON 读取和显示 json 二维数组?

问题描述

我想阅读 2D JSON

JSON 文件示例 -

[
   {
      "name":"메뉴1",
      "permission":"1",
      "link":"http://naver.com"
   },
   {
      "name":"메뉴2",
      "permission":"2",
      "link":"http://daum.net",
      "sub":[
         {
            "name":"메뉴2-1",
            "permission":"1",
            "link":"http://google.com"
         },
         {
            "name":"메뉴2-2",
            "permission":"1",
            "link":"http://yahoo.com"
         }
      ]
   }
]

我想在主菜单的底部放置一个二级菜单。我知道如何显示一维数组,但我不能显示二维数组。请帮我。

<script >
    $(document).ready(function() {
        {
            $.getJSON('./inc/menu.json', function(data) {
                var html = '';
                html += '<ul>';
                $.each(data, function(entryIndex, entry) {
                    html += '<li><a href=' + entry.link + ' title=' + entry.permission + '>' + entry.name + '</a></li>';
                });
                html += '</ul>';
                console.log(html);
                $("nav").html(html);
            });
            return false;
        }
    }); 
</script>

标签: javascriptjqueryjsongetjson

解决方案


尝试这个?

$(document).ready(function() {
  {
    $.getJSON('./inc/menu.json', function(data) {
      var html = '';
      html += '<ul>';
      $.each(data, function(entryIndex, entry) {
          if(entry.sub && entry.sub.length > 0) {
            html += '<li><ul>';
            $.each(entry.sub, function(key, val) {
               html += '<li><a href=' + val.link + ' title=' + val.permission  + '>' + val.name + '</a></li>';
            });
            html += '</ul></li>';
         } else {
            html += '<li><a href=' + entry.link + ' title=' + entry.permission  + '>' + entry.name + '</a></li>';
        }
      });
      html += '</ul>';
      console.log(html);
      $("nav").html(html);
    });
    return false;
  }
});

推荐阅读