1

ループが開始するたびに tr 行を追加する方法を誰かが教えてくれますか? 以下は私のjQueryコードです:

var row = $("<tr></tr>");

     $.each(data.response.docs, function (i,  item) { // json is the name of the object

        row.append('<td>' + item.adServerId + '</td>'); //item is named at the opening of this $.each function
        row.append('<td>' + item.advertiserId + '</td>');
        row.append('<td>' + item.advertiserName + '</td>');
        row.append('<td>' + item.campaignId + '</td>');
        row.append('<td>' + item.campaignName + '</td>');
        row.append('<td>' + item.bookedImps + '</td>');
        row.append('<td>' + item.imps + '</td>');
        row.append('<td>' + item.clicks + '</td>');
        row.append('<td>' + item.ctr + '</td>');
        row.append('<td>' + item.postViewConvs + '</td>');
        row.append('<td>' + item.postViewConvsRate + '</td>');
        row.append('<td>' + item.convs + '</td>');
        row.append('<td>' + item.convsRate + '</td>');
        row.append('<td>' + item.targetRevenue + '</td>');
        row.append('<td>' + item.revenue + '</td>');
        row.append('<td>' + item.cost + '</td>');
        row.append('<td>' + item.startDate + '</td>');
        row.append('<td>' + item.endDate + '</td>,</tr>');
        $("#adcampaignGrid").append(row);
4

2 に答える 2

2

var row = $('<tr></tr>')ループ内に移動しますか?

 $.each(data.response.docs, function (i,  item) { // json is the name of the object

     var row = $("<tr></tr>");
     // rest of your code
 }

また、@minitech が指摘したように、 text()wrapitem.xxxを使用して、面白いものがページに挿入されるのを防ぎます。

ヘッダーについては、ヘッダーを html に直接配置することをお勧めします。

http://jsfiddle.net/QtnS4/1/

<table id="aa">
    <thead>
        <tr><th>Col 1</th><th>Col 2</th></tr>       
    </thead>
    <tbody>
    </tbody>

</table>​

JS:

var records = [
    {key: "Value 1", key2: "Value 1b"},
    {key: "Value 2", key2: "Value 2b"}
];

for(var i = 0; i < records.length; i++) {
    var row = $('<tr></tr>');
    row.append($('<td></td>').text(records[i].key));
    row.append($('<td></td>').text(records[i].key2));
    $('#aa').append(row);
}
于 2012-08-23T03:04:02.133 に答える
2
$.each(data.response.docs, function (i, item) {
  var row = $("<tr></tr>");
  for (var i in item) row.append($('<td>').text(item[i]));
  $("#adcampaignGrid").append(row);
});

または、すべてのキーに必要がない場合:

$.each(data.response.docs, function (i, item) {
  var props = [
    'adServerId', 
    'advertiserId', 
    'advertiserName', 
    'campaignId', 
    'campaignName', 
    'bookedImps', 
    'imps', 
    'clicks', 
    'ctr', 
    'postViewConvs', 
    'postViewConvsRate', 
    'convs', 
    'convsRate', 
    'targetRevenue', 
    'revenue', 
    'cost', 
    'startDate', 
    'endDate'
  ];

  var row = $("<tr></tr>");
  for (var i in props) row.append($('<td>').text(item[props[i]]));
  $("#adcampaignGrid").append(row);
});
于 2012-08-23T03:09:40.153 に答える