确定我在JSON树中的哪个级别

时间:2013-05-04 13:09:56

标签: javascript jquery html json

我可能有一个简单的问题,但我无法弄清楚。如果我有一个像这样的多宗派JSON数组:

[
    {
        "name":"one",
        "children":
        [
            {
                "name":"two",
                "children":
                [
                    {
                        "name":"two",
                        "children": []
                    }, 
                    ... 
                ]

            },
            ...
        ]

    }
]

我想确定我的等级。如果我要循环真实所有将要打印的第一个实体是下面的:

one -|
     two -> View Children

点击“View Children”后:

one -|
     two -| 
          three -> View Children || Go Back.

如果点击“Go Back”,我们会回到:

one -|
     two -> View Children

所以它类似于层次结构。我无法弄清楚如何使后退按钮工作。我能够使用这种代码的平和来弄清楚前进:

level = obj; // OBJ is the json data.

function inside(events){
    temp = "";
    for (i in events) {
      temp += "<li id='"+events[i].id+"' class='"+events[i].type+"' index='"+i+"''>&nbsp;&nbsp;"+events[i].name+ "</li>";
    }
    return temp;
}

text += inside(obj);

$('#filebrowser').on('click','li.folder',function(e){

    var index =  $(this).attr('index');
    var html = "<li class='folder back' index='"+index+"'>back</li>";

    if(level[index].children){
        html = html + inside(level.[index].children);
        level = level[index].children;
    } 

    $('#filebrowser').html(html);
    e.stopPropagation();

});

我只是想说这可能是动态的,很多人应该回去,所以将后面的obj存储在一个变量中并不会削减它。

1 个答案:

答案 0 :(得分:2)

通常stacks用于跟踪导航历史记录等内容。大多数编程语言都包含某种堆栈结构的实现。在Javascript堆栈中,功能内置于Array structure中。查看push()pop()方法。

向前导航时,您可以push()将最后一页放到历史堆栈中。按下后退按钮后,您可以按照添加的相同顺序pop()输入,直到您到达第一个条目。

它可能看起来像这样:

var backStack = [];
$('#filebrowser').on('click','li.folder',function(e){

    var index =  $(this).attr('index');
    var html = "<li class='folder back' index='"+index+"'>back</li>";

    if(level[index].children){
        html = html + inside(level.[index].children);
        level = level[index].children;
    } 

    backStack.push($('#filebrowser').html);
    $('#filebrowser').html(html);
    e.stopPropagation();

});

然后按下后退按钮:

$('#filebrowser').html(backStack.pop());

或者那些东西。