我正在尝试访问下拉菜单中的所有品牌和值 但我不能用这种方式。
<select id="secim">
</select>
var data = [
{
"products": "Cars",
"brands_values" : [
{"brand":"fiat","value":1},
{"brand":"bmw","value":2}
]
}
];
$.each(data, function(i, item) {
$('#secim').append($('<option>', {
value: item.brands_values.value,
text: item.brands_values.brand
}));
});
我该怎么办?谢谢
答案 0 :(得分:2)
为品牌添加另一个循环:
var data = [
{
"products": "Cars",
"brands_values" : [
{"brand":"fiat","value":1},
{"brand":"bmw","value":2}
]
}];
$.each(data, function(i, item) {
if (item.brands_values) {
item.brands_values.forEach(brands => {
$('#secim').append($('<option>', {
value: brands.value,
text: brands.brand
}));
});
}
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="secim">
</select>
&#13;
注意:在这种情况下,您可能希望使用本机.forEach
,因为它已足够。我过去曾遇到jQuery.each()
的性能问题,所以我可以随时避免(check this):
data.forEach(item => {
if (item.brands_values) {
item.brands_values.forEach(brands => {
$('#secim').append($('<option>', {
value: brands.value,
text: brands.brand
}));
});
}
});
答案 1 :(得分:1)
$.each(data, function(i, item) {
$.each(item.brands_values, function(j, brand){
$('#secim').append($('<option>', {
value: brand.value,
text: brand.brand
}));
});
});
你需要另一次迭代 - 当然第一次&#34;循环&#34;不是很优雅,但这是由于给定的数据格式。
答案 2 :(得分:0)
迭代品牌价值,而不仅仅是数据。这样您就可以访问每个品牌和价值。
var data = [
{
"products": "Cars",
"brands_values" : [
{"brand":"fiat","value":1},
{"brand":"bmw","value":2}
]
}
];
$.each(data[0].brands_values, function(i, item) {
$('#secim').append($('<option>', {
value: item.value,
text: item.brand
}));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="secim">
</select>
答案 3 :(得分:0)
首先使用data
函数从#reduce()
创建items
列表。然后将其作为$.each
传递给您的var data = [{
"products": "Cars",
"brands_values": [{
"brand": "fiat",
"value": 1
},
{
"brand": "bmw",
"value": 2
}
]
}];
var items = data.reduce(function(p,c){
c.brands_values.forEach(function(e){
p.push(e);
});
return p;
},[]);
$.each(items, function(i,item) {
$('#secim').append($('<option>', {
value: item.value,
text: item.brand
}));
});
。
见下面的演示:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="secim"></select>
&#13;
click
&#13;