来自JSON的jQuery嵌套列表无法正常工作。 [解决了,但又来了另一个]

时间:2013-10-29 03:44:06

标签: jquery json

我正在创建一个嵌套的嵌套嵌套列表,但是我在UL中分配我的buffer时遇到了问题。 我试过了$('ul#lists').html(buffer),但它没有打印出来......

JSON

{
"browse": [
    { 
        "name":"browse by state" , 
        "command":"state" }, 

    { 
        "name":"browse by equipment" , 
        "command":"equipment" }, 

    { 
        "name":"browse by brand" , 
        "command":"brand" }
]
}

HTML

<section id="browser">
        <ul id="lists"></ul>
</section>

JQuery的

$(function(tree_click){
    $('ul#lists').on('click','.c',function(){
    var test = "";
    $(this).removeClass('c'); //To assign this event once

    $.get('scripts/list.json', function(result, status){    
        var buffer = "";
        $.each(result, function(i, val){            
            for(var i=0; i < val.length; i++){ 
            var item = val[i];
            buffer+="<li><a href='#' cmd='"+item.command+"'>"+item.name+"</a></li>";} 
        });
        $(e.target).parent().append(buffer);
    });
});
});

问题解决了。我用解决方案更新了我的问题。

但现在我的列表切换器无效。

我用它作为转发器,

$(function(toggle_list){
$("#lists").on('click','a', function() {
    return !($(this).parents("li:first").find("ul:first").slideToggle('fast'))
});
});

任何需要?

2 个答案:

答案 0 :(得分:1)

变化:

$('ul#lists').on('click','.c',function(){ 

为:

$('ul#lists').on('click','.c',function(e){

在此函数内但在$ .get调用之前指定var buffer。

要附加到点击的UL,请在点击处理程序中执行此操作:

$(e.target).append(buffer);

答案 1 :(得分:0)

假设调用click事件并且ajax请求成功并且它返回一个数组,则var item = val[i];存在问题,因为val本身是数组中的当前项。

$(function (tree_click) {
    $('#lists').on('click', '.c', function () {
        $(this).removeClass('c'); //To assign this event once

        $.get('scripts/list.json', function (result, status) {
            var buffer = $.map(result, function (item) {
                return "<li><a href='#' cmd='" + item.command + "'>" + item.name + "</a></li>";
            }).join('');
            $('#lists').html(buffer);
        });
    });
});