從JSON數據創建HTML項目符號列表時出現問題

Question

我有一些JSON，我想轉入項目符號列表。 在每個級別都有一個名稱字段和一個子字段（除了最低級別）。 我已經嘗試過使用遞歸來完成它，但我遇到了一個問題。 除最后一級外，只顯示第一個孩子。 我有一種感覺，我的一些遞歸調用可能無法正常返回。 這是我到目前為止的代碼：

function load_menu(){
    json_text=ajax_get("example.json");
    json_tree=JSON.parse(json_text);
    write_menu(json_tree.children,document.getElementById("level1"));
}
function write_menu(json,element){
    for(i=0;i<json.length;i++){
        var listitem=document.createElement("li");
        element.appendChild(listitem);
        var listitemtext=document.createElement("span");
        listitem.appendChild(listitemtext);
        listitemtext.innerText=json[i].name;
        if(json[i].children){
            listitemtext.setAttribute("onclick","toggle(this);");
            var sublist=document.createElement("ul");
            listitem.appendChild(sublist);
            write_menu(json[i].children,sublist);
        };
    };
}

我最終得到一棵看起來像這樣的樹：

Level 1,1
    Level 2,1
        Level 3,1
        Level 3,2

它應該如下所示：

Level 1,1
    Level 2,1
        Level 3,1
        Level 3,2
    Level 2,2
Level 1,2
    Level 2,3

我已經通過我的JSON檢查了它似乎沒問題，所以我想某處的遞歸一定存在問題。 有人可以幫我從這里出去嗎？

Answer 1

如果你寫for (i... JS解釋器將創建一個新的變量i如果它不存在，或者重用現有的變量，如果它確實存在。這就是問題，因為你需要在每個級別的新的循環變量遞歸。

因此，解決方案是通過寫入for (var i...而不是強制）在每個級別上強制創建變量。