任何人都可以告诉我为什么它为orderdiv ul的div创建相同的数组(toppings)。
在我的情况下,草莓在Topping-details类下没有任何元素。
但它为两者创造了相同的价值
在我的情况下,草莓在Topping-details下没有任何元素,Chocolate在Topping-details下有数据,但同时为这两个div创建了数组。
这是jsfiddle http://jsfiddle.net/RD3HZ/5/
这是我目前正在遵循的逻辑
$.each($('#ordersdiv ul'), function (i, elem) {
name = $(elem).find("label").text();
toppings = [];
$('#ordersdiv .Topping-details .tdHeading').each(function () {
values = [];
$(this).parent().find('.tpActive').each(function () {
values.push($(this).text());
});
toppings.push({
'name': $(this).text(),
'value': values
});
});
products.push({
'name': name,
'toppings': toppings
});
});
我期待输出应该是
[
{
"name": "Strawberry",
"toppings": []
},
{
"name": "Chocolate",
"toppings": [
{
"name": "Chocolate0",
"value": [
"Honey Sauce 10 ML",
"Caramel Sauce 10 ML"
]
},
{
"name": "Chocolate1",
"value": [
"Honey with Carmel 10 ML"
]
}
]
}
]
有人可以帮忙吗
答案 0 :(得分:1)
HTML代码中有2 ul
个,在每个循环中,$('#ordersdiv .Topping-details .tdHeading')
返回相同的元素集合。因此你的问题。您必须选择与 相关的.tdHeading
当前ul
元素。我认为应该重新组织您的HTML代码以使这种关系更好。但是,使用当前的HTML代码,您可以更改.tdHeading
选择代码:
$('#ordersdiv .Topping-details .tdHeading')
到此:
$(this).closest('.product-item').next('.Topping-details').find('.tdHeading')
答案 1 :(得分:0)
我试图获得您的预期输出...只需检查
var name;
var values = [];
var toppings = [];
var products = [];
$.each($('#ordersdiv ul'), function (i, elem) {
name = $(elem).find("label").text();
toppings = [];
$('.Topping-details .tdHeading',$(elem).parent().parent()).each(function () {
values = [];
val = $(this).text();
$(this).parent().find('.tpActive').each(function () {
values.push($(this).text());
});
if(val.indexOf(name)> -1)
toppings.push({
'name': $(this).text(),
'value': values
});
});
products.push({
'name': name,
'toppings': toppings
});
});
alert(JSON.stringify(products));