[英]Display all items in a json array
我正在嘗試與json合作,我幾乎擁有我需要的東西。 我正在顯示正確的信息,但我必須將數組中的每個項目傳遞給變量,然后打印變量。 我想顯示每個數組中的所有項目。 我正在使用的json數據來自一個發票應用程序( www.curdbee.com ),我正在嘗試為客戶顯示每張發票。 我想要顯示的數據是每個訂單項,訂單項價格和總金額。 這是我的代碼:
$(document).ready(function() {
$.getJSON('https://nspirelab.curdbee.com/invoices.json?api_token=__token__', function(data){
$.each(data, function(index, item){
var total = item.invoice.total_billed;
var lineItemName1 = item.invoice.line_items[0].name_and_description;
var lineItemName2 = item.invoice.line_items[1].name_and_description;
var lineItemPrice1 = item.invoice.line_items[0].price;
var lineItemPrice2 = item.invoice.line_items[1].price;
$('#results').append('<div class="lineItem"><ul><li>' + lineItemName1 + lineItemPrice1 + '</li><li>' + lineItemName2 + lineItemPrice2 + '</li><li>' + total + '</li></ul></div>');
});
});
});
嵌套循環(或者,在jQuery中,嵌套的$.each()
)將完成這項工作:
$.getJSON('https://nspirelab.curdbee.com/invoices.json?api_token=&client=104929', function(data){
$.each(data, function(index, item){
// create an empty ul (initially disconnected from the DOM)
var $ul = $("<ul/>");
// iterate over the line items
$.each(item.invoice.line_items, function(i, lineItem) {
// create an li element with the line details and append
// it to the ul
$ul.append( $("<li/>").html(lineItem.name_and_description + lineItem.price) );
});
// add the totals to the end of the ul
$ul.append( $("<li/>").html(item.invoice.total_billed) );
// create a new div, append the ul to it, and append the div to results
$('#results').append( $('<div class="lineItem"/>').append($ul) );
});
});
有一些荒謬的圖書館可以讓這樣的事情變得更容易。 搜索“javascript模板”以查看您所缺少的內容,並了解您可以選擇的各種庫。
如果我理解你的問題,我認為你正在尋找的是某種迭代機制,嘗試下划線.js 。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.