我有一个JSON输出,我想在每个<li>
内显示每个项目。
JSON输出如下所示:
var data = [
{
"MachineID":"171914",
"Cost":"13,642.41",
"Currency":"PHP"
},
{
"MachineID":"172233",
"Cost":"1,367.73",
"Currency":"PHP"
},
{
"MachineID":"41116",
"Cost":"2,608.20",
"Currency":"PHP"
},
{
"MachineID":"178077",
"Cost":"1,517.04",
"Currency":"PHP"},
{
"MachineID":"176430",
"Cost":"20,876.72",
"Currency":"PHP"
}
]
我的代码就是这样:
$.each(data, function(i, obj) {
$.each(obj, function(i, val) {
$('li').append(obj.MachineID);
});
});
现在结果显示如下:
Foo 171914171914171914172233172233172233411164111641116178077178077178077176430176430176430 Bar 171914171914171914172233172233172233411164111641116178077178077178077176430176430176430
我可能忽略了jQuery.each
调用的内容,我只需要显示每个<li>
一个MachineID,输出应该是这样的:
Foo 171914 Bar 172233 Baz 41116 Qux 178077
依旧......
答案 0 :(得分:4)
如果这些是现有的li
元素,最好的方法是选择li
元素,迭代它们,并使用迭代中的索引来获取数据。
$('li').slice(0,data.length)
.each(function(i,el){
$(this).append(data[i].MachineID);
});
我使用了.slice()
,因此,如果有多个li
元素而非数据,则不会尝试访问不存在的数据。
演示: http://jsfiddle.net/MYC4J/
如果<li>
元素尚不存在,那么您需要创建它们:
var ul = $('ul');
$.each(data,function(i,obj) {
$('<li>',{text:obj.MachineID}).appendTo(ul);
});
答案 1 :(得分:0)
因为你遍历每个对象和每个对象附加的每个属性3次MashineId。
你只需要1 $ .each-loop并将MashineId附加到正确的li。
类似的东西:
$.each(data, function(index, value){
$("ul li:nth-child(" + (index+1) + ")").append(value.MashineId);
});
nth-child()选择li(从1开始的索引)并附加MashineId。 这是因为您的MashineIds只是添加到下一个li。也许你需要为你的情况另一个逻辑找到正确的li。