Json数据上的Jquery循环

如果用户点击按钮A，则循环应该贯穿cat.json文件并检查对象是否为(jobcategory)"Data2":"B" == (job)"DataB":"B"，如果是，则在div中显示-(job)"DataA":"C"和(job)"DataB":"B"。Json数据上的Jquery循环

我有Json数据如下。

文件名：cat.json

{ 
    "jobcategory": [ 
     {"Data1":"A","Data2":"B"}, 
     {"Data3":"C","Data4":"D"} 
    ], 

    "job":[ 
     {"DataA":"C","DataB":"B"}, 
     {"DataC":"T","DataD":"E"} 
    ] 
}

myscript.json是如下

$(document).ready(function() { 
    $.getJSON("cat.json", function(data) { 
     $.each(data.jobcategory, function() { 
      $("ul").append("<li><button>"+this['Data1']+"</button></li>"); 
     }); 
    }); 
});

它显示 “A” 和 “B” 按钮没关系的网页上。不知道当用户点击按钮“A”时如何在div中显示"DataA":"C"和"DataB":"B"。

有什么建议吗？

来源

2013-11-21 user3011931

var btn = $("<li><button>"+this['Data1']+"</button></li>"); 
$("ul").append(btn); 
btn.click(function() { 
    $(this).parent().append('<div>' + data.jobs['Data' + $(this).text()] + '</div>'); 
});

来源

2013-11-21 21:21:14 beautifulcoder

我认为使用实际的javascript循环会更高效。 jQuery循环非常适合循环DOM元素，但对于JSON不是必需的。这些功能应该有助于您朝着正确的方向前进。

function jsonToList (json) { 
    jsonLen = json.length; 
    for (var i = 0; i < jsonLen; i++) { 
     for (item in json[i]) { 
      createLi(json[i][item]); 
     } 
    } 
} 

function createLi (text) { 
    $("#list").append("<li><button>"+text+"</button></li>"); 
}

继承人，你可以修改演示，以满足您的需求：http://jsfiddle.net/7KvZn/

来源

2013-11-21 21:38:47 Jeffpowrs

Json数据上的Jquery循环

回答

相关问题