1
$.getJSON(url , function(data) {
    var tbl_body = "";
    $.each(data, function() {
        var tbl_row = "";
        $.each(this, function(k , v){
            tbl_row += "<td>"+v+"</td>";
            console.log( k +' : '+ v );
            HeadKeys = '<tr><td><b>'+k+'</b></td></tr>';
        })
        tbl_body += "<tr>"+tbl_row+"</tr>";                 
    });
    $("#myTable tbody").html(HeadKeys + tbl_body);
});


このコードを試していますが、テーブルの行にキーが 1 つしか出力されません。

私が間違っていることは何ですか?

デモ

4

2 に答える 2

2

テーブル ヘッダーが 1 回だけ検査されるようにする必要があります。また、文字列を使用して構築するのではなく、HTML が適切にエスケープされていることを確認することもお勧めします (場合によっては、その方が高速な場合もあります)。

$.getJSON(url , function(data) {
    var $head = null,
        $body = $('<tbody>');

    $.each(data, function(index, obj) {
        if ($head === null) {
            // generate the first row if necessary
            $head = $('<tr>').append($.map(obj, function(value, name) {
                return $('<th>', { text: name });
            }));
        }
        // generate each row
        $('<tr>').append($.map(obj, function(value, name) {
            return $('<td>', { text: value });
        })).
            appendTo($body);
    });

    // append all the things    
    $("#myTable").append($head).append($body);
});

オブジェクト プロパティの特定の順序に依存することは、必ずしも移植可能ではないことに注意してください。言語の仕様は、特定の順序が守られることを保証するものではありません。したがって、より安定した解決策は、順序を自分で制御することです。

于 2014-07-10T02:14:51.253 に答える