如何循环访问jason数据并将其显示在数据列表标记（dl）中 [英] How to loop through jason data and display it in data list tag (dl)
问题描述
我想通过一些JSON数据（var mydata）来循环，而mydata是一个由两个元素组成的数组，它是数组中的第二个元素
mydata [1] 是一个多维数组，我需要在dt中显示第一个元素，即 mydata [0] ，并显示元素从mydata [1]在一个dd内。
我尝试了所有的选择，但我很困难，我需要任何帮助。以下是我的代码：
var mydata = [
[{
id：67 ，
name：Baby& Toddler Clothing
}，{
id：68，
name：Kids'Clothing，Shoes& ;配件
，{
id：69，
name：服装，重演剧院
}]，
[
[{
id：572，
name：Baby Clothing Accessories
}，{
id：573，
name：Baby Shoes
}]，
[{
id：579，
name：Boys Clothing [Size 4& amp ;]
}，{
id：580，
name：Boys Shoes
}]，
[{
id：588，
name：Costumes
}，{
id：589，
name：Reenactment & Theatre
}]
]
]
函数getCategories（id）{
$ .ajax（{
url：'{$ getcat Url}'，
type：'POST'，
data：{category_id：id}，
success：function（data）{
data = jQuery.parseJSON（data）;
//console.log(data）;返回;
if（data.length> 0）{
firstdata = data [0];
secdata = data [1];
for（var i = 0; i< firstdata.length; i ++）{
level_1 = firstdata [i] .name;
level_1_id = firstdata [i] .id;
for（var j = 0; j
level_2 ='';
level_2 = secdata [i] [j] .name;
level_2_id = secdata [i] [j] .d;
}
console.log（level_2）;
}
var dldata = $（
'< dl>'+
< dt href ='+ level_1_id +' >+ level_1 +< / dt>+
< dd href ='+ level_2_id +'>+ level_2 +< / dd>+
'< / dl>'
）;
}
} else {
console.log（'这个类别没有项目'）;
error：function（jqXHR，errMsg）{
//处理错误
console.log（errMsg）;
}
}）;
}
var level_1和level_1_id工作正常，但我不断收到变量level_2的错误，错误表示无法读取未定义的属性'名称'，任何解决这个问题的方法都将得到赞赏，并且也开放给了关于更好地实现它的新想法，
基本上，问题在于每次覆盖 level_1 和 level_2 变量您的 for 循环运行。因此，当你访问制作HTML的代码时，它们会被覆盖多次，只剩下最后一个版本，并且只能在任何情况下打印一次。
<这将解决它 - 在这种情况下，通过直接在每个循环内生成HTML元素，虽然你当然可以通过附加到一个变量，然后在最后输出所有内容，如果这是你的偏好。
var data = [[{id：67，name：Baby & Toddler Clothing}，{id：68，name：Kids'Clothing，Shoes& Accessories}，{id：69，name：Costumes，Reenactment Theater }，[[{id：572，name：Baby Clothing Accessories}，{id：573，name：Baby Shoes}]，[{id ：579， 名字：男孩服装[尺码4& ]，{id：580，name：Boys Shoes}]，[{id：588，name：Costumes}，{id： 589，name：Reenactment& （data.length> 0）{var content = $（＃content）; firstdata = data [0]; secdata = data [1]; for（var i = 0; i< ; firstdata.length; i ++）{var dl = $（＃content）。append（< dl />）; dl.append（< dt href ='+ firstdata [i] .id +'>+ firstdata [i] .name +< / dd>）; for（var j = 0; j< secdata.length; j ++）{if（secdata [i] [j]！ ==未定义）{dl.append（< dd href ='+ secdata [i] [j] .id +'>+ secdata [i] [j] .name +< / dd> ）;}}} content.append（dl）;} else {console.log（'this item for this categories'）;} < script src =https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js >< / script>< div id =content>< / div>
$ b
I'm trying to loop through some JSON data (var mydata) and mydata is an array of two elements, the second element in the array
mydata[1] is a multidimensional array, I need to display the first element i.e mydata[0] in a dt and display elements from mydata[1] in a dd within that.
I tried every option but I'm really stuck and I need any help on this. Below is my code:
var mydata = [
[{
"id": "67",
"name": "Baby & Toddler Clothing "
}, {
"id": "68",
"name": "Kids' Clothing, Shoes & Accessories"
}, {
"id": "69",
"name": "Costumes, Reenactment Theater"
}],
[
[{
"id": "572",
"name": "Baby Clothing Accessories "
}, {
"id": "573",
"name": "Baby Shoes"
}],
[{
"id": "579",
"name": "Boys Clothing [Sizes 4 & Up] "
}, {
"id": "580",
"name": "Boys Shoes"
}],
[{
"id": "588",
"name": "Costumes"
}, {
"id": "589",
"name": "Reenactment & Theater "
}]
]
]
function getCategories(id){
$.ajax({
url: '{$getcatUrl}',
type: 'POST',
data: {category_id: id},
success: function (data) {
data = jQuery.parseJSON(data);
//console.log(data); return;
if(data.length > 0){
firstdata = data[0];
secdata = data[1];
for(var i = 0; i < firstdata.length; i++) {
level_1 = firstdata[i].name;
level_1_id = firstdata[i].id;
for(var j = 0; j< secdata.length; j++){
if(secdata[i][j] !== undefined){
level_2='';
level_2 = secdata[i][j].name;
level_2_id = secdata[i][j].d;
}
console.log(level_2);
}
var dldata = $(
'<dl>'+
"<dt href='" + level_1_id + "'>" + level_1 + "</dt>"+
"<dd href='" + level_2_id + "'>" + level_2 + "</dd>"+
'</dl>'
);
}
}else{
console.log('no item for this categories');
}
},
error: function(jqXHR, errMsg) {
// handle error
console.log(errMsg);
}
});
}
The var level_1 and level_1_id works fine, but i keep getting error for variable level_2, the error says can't read property 'name' of undefined, any solution to this problem will be appreciated and am also open to new ideas about doing it better,
Essentially the problem is that you overwrite the level_1 and level_2 variables each time your for loops run. So by the time you get to the code which makes the HTML, they have been overwritten multiple times and only the last version remains, and you only print that once in any case.
This will resolve it - in this case by generating the HTML elements directly within each loop, although you could of course do it by appending to a variable and then outputting everything at the end, if that's your preference.
var data = [
[{
"id": "67",
"name": "Baby & Toddler Clothing "
}, {
"id": "68",
"name": "Kids' Clothing, Shoes & Accessories"
}, {
"id": "69",
"name": "Costumes, Reenactment Theater"
}],
[
[{
"id": "572",
"name": "Baby Clothing Accessories "
}, {
"id": "573",
"name": "Baby Shoes"
}],
[{
"id": "579",
"name": "Boys Clothing [Sizes 4 & Up] "
}, {
"id": "580",
"name": "Boys Shoes"
}],
[{
"id": "588",
"name": "Costumes"
}, {
"id": "589",
"name": "Reenactment & Theater "
}]
]
]
if (data.length > 0) {
var content = $("#content");
firstdata = data[0];
secdata = data[1];
for (var i = 0; i < firstdata.length; i++) {
var dl = $("#content").append("<dl/>");
dl.append("<dt href='" + firstdata[i].id + "'>" + firstdata[i].name + "</dd>");
for (var j = 0; j < secdata.length; j++) {
if (secdata[i][j] !== undefined) {
dl.append("<dd href='" + secdata[i][j].id + "'>" + secdata[i][j].name + "</dd>");
}
}
}
content.append(dl);
} else {
console.log('no item for this categories');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="content"></div>
这篇关于如何循环访问jason数据并将其显示在数据列表标记（dl）中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
