0

我有一个 XUL 树,它将包含一些动态 JSON 树。

我有 JSON(由我的 Win 应用程序生成):

{
    "Description": "",
    "id": "0x7183D2AD",
    "Name": "",
    "Children": [{
        "Description": "",
        "id": "0x660452D5",
        "Name": "Bookmarks menu",
        "Children": [{
            "Description": "",
            "id": "0x32DD7955",
            "Name": "Mozilla Firefox",
            "Children": []
        }]
    },
    {
        "Description": "",
        "id": "0x10EFAAFD",
        "Name": "Bookmarks panel",
        "Children": [{
            "Description": "",
            "id": "0x2542B587",
            "Name": "123",
            "Children": []
        }]
    },
    {
        "Description": "",
        "id": "0x39AD4290",
        "Name": "Tags",
        "Children": []
    },
    {
        "Description": "",
        "id": "0x464248E7",
        "Name": "unassigned bookmarks",
        "Children": []
    }]

我想用这个数据填充 XUL 树并实现结构(例如:这个 JSON ^^):

  • 书签菜单
    • 火狐浏览器
  • 书签面板
    • 123
  • 标签
  • 未分配的书签

我写了 JS 递归函数:

    JOToTreeNode: function(RootEl,JO) {
        var ti = document.createElementNS(XUL_NS,'treeitem');
        ti.setAttribute("id",JO.id);
        var tr = document.createElementNS(XUL_NS,'treerow');
        ti.appendChild(tr);
        var tc1 = document.createElementNS(XUL_NS,'treecell');
        var tc2 = document.createElementNS(XUL_NS,'treecell');
        tc1.setAttribute("label",JO.Name);
        tc2.setAttribute("label",JO.Description);
        tr.appendChild(tc1);
        tr.appendChild(tc2);        
        if (JO.Children.length > 0) {
            var child = document.createElementNS(XUL_NS,"treechildren");
            ti.appendChild(child);
            for (var i = 0; i < JO.Children.length; i++) {
             UtilCommon.JOToTreeNode(child,JO.Children[i]);    
            }
        };
        RootEl.appendChild(ti);
    }
...
    UpdateTree: function(el) {
        var els = el.getElementsByTagName("treechildren");
        //Drop the previous tree
            if(els.length > 0) {el.removeChild(els[0])};
        //Get JSON tree of groups
        var  http = new XMLHttpRequest();
        http.open("GET","http://"+this.host+":"+this.port+"/jsfolderstree",false);
        http.send(null);
        if (http.status == 200) { 
            var jtree = JSON.parse(http.responseText);
            var child = document.createElementNS(XUL_NS,"treechildren");
            el.appendChild(child);
            for (var i = 0; i < jtree.Children.length; i++) {
             UtilCommon.JOToTreeNode(child,jtree.Children[i]);
            };

    };
  }

它可以工作,但树只包含第一级节点,例如:

 - Bookmarks menu
 - Bookmarks panel
 - Tags
 - Unassigned bookmarks

如果我放置代码:

alert(JO.Name);

在 UtilCommon.JOToTreeNode 中,我会看到像“123”和“Mozilla firefox”这样的子项是存在的,但不会作为子项添加到树中。

我的错误在哪里,当子项未附加到树时,如何修复错误?

谢谢。

4

1 回答 1

2

根据tree-XUL 文档,您应该设置container=true嵌套树项

...
if (JO.Children.length > 0) {
    ti.setAttribute("container", true);
    var child = document.createElementNS(XUL_NS,"treechildren");
    ti.appendChild(child);
    for (var i = 0; i < JO.Children.length; i++) {
       UtilCommon.JOToTreeNode(child,JO.Children[i]);    
    }
};
...
于 2013-11-12T15:29:49.890 回答