簡單的JSON到HTML表

我有一個非常簡單的數據，我想在表中顯示。簡單的JSON到HTML表

DATA

[{ 「1」：「紅」，「2」：「橙色」，「3」：「藍」，「4」：「黃色」}]

CODE：

var a = []; 
        $.each(data, function (key, val) { 
         a.push('<tr id="tr_' +key+ '">'); 
         a.push('<td>' + key+ '</td>'); 
         a.push('<td>' + val+ '</td>'); 
         a.push('</tr>'); 
        }); 
        var s = a.join(''); 
        $('#color-list').html(s);

上述代碼導致[對象對象]而不是數據。

下面是我的預期結果

1紅色

2橙

3藍色

4黃色

任何建議將不勝感激

來源

2012-05-15 genpet

你很可能使用專用的jQuery插件來填充從數據JSON轉換爲HTML https://github.com/anuary/jquery-json-to-table。你正在玩原始的HTML，而不是DOM。這不是很實際或不安全。既然你已經在使用jQuery，你可能會學習使用'.text（）'和'.html（）'。 – Gajus

你的數據變量是一個數組（包含onl y一個元素）。該對象實際上是該數組的第一個元素。所以使用：

$.each(data[0], function (key, val) { 
    ...

來源

2012-05-15 07:29:35 njr101

非常感謝！這正是我想要的。 – genpet

您的數據是1值的數組，它是一個對象。如果循環訪問數組，則會在表中將該對象作爲值獲取一行。

相反，你應該刪除[]和剛纔的對象，然後再通過那不是鍵/值：

var data = {"1":"Red","2":"Orange","3":"Blue","4":"Yellow"}

這就給你想要的結果。

如果不能擺脫[]出於某種原因（例如，外部數據源），那麼只使用在循環而不是數據[0]數據從陣列中的第一位置獲得的對象。

來源

2012-05-15 07:31:44 howard10

謝謝，它的作品！ – genpet

你可以循環圍繞以這種方式：

// If the returned data is an object do nothing, else try to parse 
var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray; 
for (var i = 0; i < array.length; i++) { 
    str += '<tr>'; 
    for (var index in array[i]) { 
     str += '<td>' + array[i] + '</td><td>' + array[i][index] + '</td>'; 
    } 
    str += '</tr>'; 
}

來源

2012-05-15 07:42:52 SpareMe

其實有時它沒有當JSON是字符串形式的作品。請嘗試以下操作：

[{"Srno":38,"ReqId":36,"ItemId":155,"Qty":90.00,"TransferItemId":null,"TransferQty":null,"ExpReqDated":"\/Date(1363285800000)\/","IsCancelled":false,"Remarks":null},d":171,"Qty":40.00,"TransferItemId":null,"TransferQty":null,"ExpReqDated":"\/Date(1363717800000)\/","IsCancelled":false,"Remarks":null},{"Srno":113,"ReqId":53,"ItemId":172,"Qty":40.00,"TransferItemId":null,"TransferQty":null,"ExpReqDated":"\/Date(1363717800000)\/","IsCancelled":false,"Remarks":null}]"

那麼就需要通過JSON.parse（數據）將其轉換在數組轉換JSON ...

來源

2013-09-20 10:12:46

簡單的JSON到HTML表

回答

相關問題