javascript - jQuery 中列表不显示？

Question

我正在制作一个动态列表，但它没有显示。为什么？

这是我的 fiddle :http://jsfiddle.net/mFScX/4/

function buildNavForNodes(nodes) {
    console.log(nodes);
  var result = '<div data-role="collapsible"> <ul>';
  var i = 0;
  var len = nodes.length;
  for(; i < len; i++) {
    result += buildNavForNode(nodes[i]);
  }
  return result + " </ul></div>";
}

应该这样显示:http://jsfiddle.net/Dn4XB/4/

按钮数组有三个对象:这意味着三个可折叠行显示。

**Button
Button
Button**

现在按钮数组索引在 0 对象处有按钮数组。

因此，在索引零中，按钮有另一个可折叠行。

Answer 1

<罢工>您很可能想要这样的东西( Example ):

function buildNav(nodes) {
    var i = 0, len = nodes.length, result;
    for(; i < len; i++) {
        result ='<div data-role="collapsible"><h1><a>Button</a></h1><ul>';
        if(!nodes[i].Button) result += '<li><h3>Button</h3></li></ul></div>';
        else result += buildNav(nodes[i].Button);
    }
    return result;
}

我不确定这是否正确，但是， .trigger('create')应在插入 HTML 后调用。

更新:( Example )

function buildNav(nodes) {
    var result = '<div data-role="collapsible-set" id="stuff">';
    var i = 0, len = nodes.length;
    for(; i < len; i++) {
        result += "<div data-role='collapsible' data-content-theme='c'><h3><a>Button</a></h3>";
        if(nodes[i].Button) {
            result += buildNav(nodes[i].Button) + "</div>";
        }
        result += "</div>";
    }
    return result + "</div>";
}

$(function(){
    $('#test').html(buildNav(testData.Button)).trigger('create');
});