如何使用javascript jquery在html頁面中顯示json（array）響應

Question

我有一些json響應，其中包含數組格式的數據。我必須在html頁面中逐一顯示該數據。在我的html頁面中，我為商人名稱，產品名稱和刪除按鈕添加了一些div元素。並且同一產品的json數據包含數組名稱，商家名稱，特定商家的刪除按鈕。現在當我在頁面中顯示數據時，在該產品列表之后向我顯示商家的所有名稱。意味着它就像商家名稱：abc商人名稱：xyz

產品名稱：a1產品名稱：a2商人1的移除按鈕商人2的移除按鈕，但我要顯示此數據，例如商人名稱：abc產品名稱：a1的merchnant1移除按鈕商人名稱：xyz產品名稱：a2 Merchant2的移除按鈕這是代碼

$("#merchantname").append("<font color='green'>"+(responseObj.merchants.merchantname[i])+"</font>"+"\n");
    $("#productname").append(responseObj.merchants.productname[i]+"\n");

    $("#remove").append("<input type='button' value='remove' onClick='remove(needID)'>"+"</input>"+"\n");

Answer 1

根據對您問題的了解，我編寫了一小段代碼，可能有助於回答問題。

我會盡力回答您的任何問題。

//Create the dom from the json response
$.each(responseObj.merchants,function(index){
    record=$('<div/>',{'class':'record'});
    merchantname=$('<span/>',{'class':'merchant'});
    merchantname.text(responseObj.merchants[index].merchantname);

    productname=$('<span/>',{'class':'product'});
    productname.text(responseObj.merchants[index].productname);

    remove=$('<input/>',{'class':'remove','val':'Remove','type':'button'});

    record.append(merchantname).append(productname).append(remove);

    $('#view').append(record);
});

// Handler for the remove button
$(document).on('click','.remove',function(){
// Statement to remove record
    $(this).closest('.record').remove();
});

小提琴