2

我可能有一个简单的问题,但我无法弄清楚。如果我有一个像这样的多教派 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 存储在变量中不会减少它。

4

1 回答 1

2

通常堆栈用于跟踪诸如导航历史之类的事情。大多数编程语言都包含某种堆栈结构的实现。在 Javascript 中,堆栈功能内置于Array结构中。查看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());

或类似的规定。

于 2013-05-04T13:27:26.357 回答