javascript - 用jquery生成表

Question

我正在尝试生成一个表，表头在左边，表数据在右边。:

   var displayRecords = [{
     customers_transaction_detail_id: 1,
     customer_id: 2
   }];
   
   $('#emp_body').html('');
    for (var i = 0; i < displayRecords.length; i++) {
        th = $('<th/>');
        tr = $('<tr>');
        var row1 = "<th>Customer ID</th> <td>" + displayRecords[i].customer_id + "</td></tr>";
        var row2 = "<th>Transaction ID</th> <td>" + displayRecords[i].customers_transaction_detail_id + "</td></tr>";
        $('#emp_body').append(row1,row2);
    }

我的 表 tbody 的 ID 为 #emp_body。上面的代码生成一个水平表格而不是垂直表格。

Answer 1

试试这个:

$('#emp_body').html('');
var content = '<table>';
for(i = 0; i < 3; i++){
    content += '<tr><td>' + 'Result ' +  i + '</td></tr>';
}
content += '</table>';

$('#emp_body').append(content);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="emp_body"></div>

您的代码:

var displayRecords = [{
  customers_transaction_detail_id: 1,
  customer_id: 2
 }];

$('#emp_body').html('');
for (var i = 0; i < displayRecords.length; i++) {
 var content = '<tr>';

 content += '<th>Customer ID</th>';
 content += '<td>' + displayRecords[i].customer_id + '</td></tr>';

 content += '<th>Transaction ID</th>';
 content += '<td>' + displayRecords[i].customers_transaction_detail_id + '</td>';

 content += '</tr>';
 $('#emp_body').append(content);
}

并确保你 table有<tbody id="emp_body">