從JSON數據創建HTML項目符號列表的問題

我有一些JSON，我想要將項目列入項目符號列表。每個級別都有一個名稱字段和一個子字段（除了最低級別）。我曾嘗試使用遞歸來做到這一點，但我遇到了一個問題。除最後一級外，只顯示第一個孩子。我有一種感覺，我的一些遞歸調用可能不能正確返回。這裏是我的代碼至今：從JSON數據創建HTML項目符號列表的問題

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，這似乎是好的，所以我猜想遞歸的地方肯定有問題。有人可以幫我從這裏出去嗎？

來源

2012-04-25 cgimusic

'json.length'返回什麼？基於示例輸出，它看起來會返回而不是您期望的2。編輯：在進一步的調查中，'i'設置爲'0'會總是小於'json.length'，所以它只會去一次，不是？ – 2012-04-25 18:42:59

你可以嘗試寫'for（var i ...'而不是'for（i ...'）。當你像這樣遞歸時，函數可能會重複使用相同的'i' – 2012-04-25 18:47:21

給我們示例JSON輸入。我雖然設置爲0，所以即使它重新使用'i'，它也將被重置'i = 0' – 2012-04-25 18:54:40

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

因此，解決辦法是強制在每個級別上創建一個變量，改爲編寫for (var i...。

來源

2012-04-25 19:48:09

從JSON數據創建HTML項目符號列表的問題

回答

相關問題