1

jsonファイルから水平メニューを実行するタスクがあります.これを行うことで、サブチャイルドを取得できませんでした. 私のjsonファイルは

var data = [{
    "menu":[
        {
            "MenuId":1,
            "MenuName":"Home",
            "MenuLink":null,
            "Action":null,
            "Controller":null,
            "ParentID":null,
            "SortOrder":1,
            "ModuleId":null,
            "Menus":{
            }
        },
        {
            "MenuId":2,
            "MenuName":"New Transaction",
            "MenuLink":null,
            "Action":null,
            "Controller":null,
            "ParentID":null,
            "SortOrder":2,
            "ModuleId":null,
            "Menus":{
            }
        },
        {
            "MenuId":3,
            "MenuName":"Portfolio",
            "MenuLink":null,
            "Action":null,
            "Controller":null,
            "ParentID":null,
            "SortOrder":3,
            "ModuleId":null,
            "Menus":{
            }
        },
        {
            "MenuId":4,
            "MenuName":"Analytics",
            "MenuLink":null,
            "Action":null,
            "Controller":null,
            "ParentID":null,
            "SortOrder":4,
            "ModuleId":null,
            "Menus":{
            }
        },
        {
            "MenuId":5,
            "MenuName":"Instructions",
            "MenuLink":null,
            "Action":null,
            "Controller":null,
            "ParentID":null,
            "SortOrder":5,
            "ModuleId":null,
            "Menus":{
            }
        },
        {
            "MenuId":6,
            "MenuName":"Data Upload",
            "MenuLink":null,
            "Action":null,
            "Controller":null,
            "ParentID":null,
            "SortOrder":6,
            "ModuleId":null,
            "Menus":{
            }
        },
        {
            "MenuId":7,
            "MenuName":"Administration",
            "MenuLink":null,
            "Action":null,
            "Controller":null,
            "ParentID":null,
            "SortOrder":7,
            "ModuleId":null,
            "Menus":[
                {
                    "MenuId":8,
                    "MenuName":"Masters",
                    "MenuLink":null,
                    "Action":null,
                    "Controller":null,
                    "ParentID":7,
                    "SortOrder":1,
                    "ModuleId":null,
                    "Menus":[
                        {
                            "MenuId":10,
                            "MenuName":"Currency",
                            "MenuLink":"/Currencies/Index",
                            "Action":"Index",
                            "Controller":"Currencies",
                            "ParentID":8,
                            "SortOrder":1,
                            "ModuleId":null,
                            "Menus":{
                            }
                        },
                        {
                            "MenuId":11,
                            "MenuName":"Country",
                            "MenuLink":"/Countries/Index",
                            "Action":"Index",
                            "Controller":"Countries",
                            "ParentID":8,
                            "SortOrder":2,
                            "ModuleId":null,
                            "Menus":{
                            }
                        }
                    ]
                },
                {
                    "MenuId":9,
                    "MenuName":"User Management",
                    "MenuLink":null,
                    "Action":null,
                    "Controller":null,
                    "ParentID":7,
                    "SortOrder":2,
                    "ModuleId":null,
                    "Menus":{
                    }
                }
            ]
        }
    ]
}
];
$(function() {
for(var i = 0, j = data[0].menu.length; i<j; i++) {
    var root_menu = data[0].menu[i];
    if(root_menu.hasOwnProperty("MenuId")) {
        $("#menu").append('<li><a href="#" class="parent-menu">' + root_menu.MenuName + '</a></li>');
        if(root_menu.hasOwnProperty("Menus") && root_menu.Menus.length > 0) {
            $("#menu").append("<li><ul class='child-list' id='menu_" + root_menu.MenuId + "'>");
            for(var n = 0, m = root_menu.Menus.length; n<m; n++) {
                var sub_menu = root_menu.Menus[n];
                if(sub_menu.hasOwnProperty("MenuId")) {
                    $("#menu_" + root_menu.MenuId).append("<li class='nav-child'>" + sub_menu.MenuName + "</li>");
                }
            }
            $("#menu").append("</li></ul>");
        }
    }
}
});

このjsonファイルを使用してサブ子を取得するにはどうすればよいですか? http://jsfiddle.net/JcU4G/9/から私のコードを見ることができます 。この管理メニューには 2 つのサブメニューがあり、そのサブメニューには別のサブメニューがあります。フィドルでは、サブメニューがホームの下にあることがわかります。しかし、実際には、管理メニューの下にそのサブメニューが必要であり、これらのサブメニューマスターには別のグランドサブメニューが含まれています。

4

2 に答える 2

1

で取得できますがdata[0].menudata変数は JSON ではありません。それは配列です。変数の最初と最後にある角括弧を取り除く必要があります。

それ以外の:

var data = [{
  menu: [
    {
       'Menu1'

あなたがしたい:

var data = {
  menu: [
    {
       'Menu1'

そして今dataはオブジェクトです。そこから、forループはカウントではなくオブジェクト内のキーを反復します。

for(var key in data.menu) {
    var root_menu = data.menu[key];

あなたの Fiddle を更新しました。うまくいけば、それはあなたが探しているものです。

編集: http://jsfiddle.net/buUtB/1/

于 2013-02-27T06:47:15.887 に答える
0

再帰関数を使用できます。

私が投稿しているコードはメニューを作成しません。各メニュー名をコンソールに記録するだけです。ただし、オブジェクトを反復処理する必要があることを示しています。メニューをレンダリングするには、ログ コードをコードに置き換える必要があります。

for (var i in data[0].menu) {
    logMenu(data[0].menu[i]);
}

function logMenu(menuNode) {
    console.log(menuNode.MenuName);
    for (var i in menuNode.Menus) {
        logMenu(menuNode.Menus[i]);
    }
}

この関数は、サブメニューごとに自分自身を 1 回呼び出すことに注意してください。

各サブメニュー項目がどのメニュー項目に属しているかを知るために、おそらく「親」パラメーターを渡す必要があります。「親」パラメーターが null の場合、サブメニュー要素ではなく、ページに新しいルート メニュー要素を作成する必要があることがわかります。

例えば

for (var i in data[0].menu) {
    logMenu(data[0].menu[i], null);
}

function logMenu(menuNode, parent) {
    if (parent == null) {
        //Render root menu element in HTML
    } else {
        //Render sub menu element in HTML related to parent
    }
    for (var i in menuNode.Menus) {
        logMenu(menuNode.Menus[i], menuNode);
    }
}
于 2013-02-27T06:45:47.270 に答える