时间戳

首页 > 解决方案 > 如何在一个表中循环两个对象

javascript - 如何在一个表中循环两个对象

问题描述

我有这样的数据，但发现很难循环两个对象并将数据放入一个表中，其中 th 是公司，td 是他们的驱动程序

{…}
  driver: Array(18) [ {…}, {…}, {…}, … ]
  company: "TEST"
{…}
  driver: Array(10) [ {…}, {…} ]
  company: "TEST 1"

​我试过这个，但不能正常工作

            $.each(response.allDrivers, function(key, value){

          var thead = '';
          thead += '<th>'+value.company+'</th>';

          $('#table-allDrivers thead tr').append(thead);

          $.each(value.driver, function(id,name){
            var tbody = '';
            tbody = '<tr> <td>'+name.driver+'<td></tr>';
            $('#table-allDrivers tbody').append(tbody);
          })
        });

我得到的结果是这样的

<thead>
 <tr>
  <th>TEST</th>
  <th>TEST 1</th>
 </tr>
</thead>
<tbody>
 <tr>
   <td>Driver 1</td>
   <td></td>
 </tr>
 <tr>
  <td>Driver 2</td>
  <td></td>
 </tr>
 <tr>
  <td>Driver 3</td>
  <td></td>
 </tr>
 <tr>
  <td>Driver 4</td>
  <td></td>
 </tr>
</tbody>

标签： javascriptjquery

解决方案

假设您有 2 个驱动程序（驱动程序 1 和驱动程序 2）但可能更多。找到具有更多元素的元素并从中进行迭代（我假设 driver1 具有更多元素）；

var markup = "";
for( let i = 0 ; i < driver1.length; i++)
{
if (i < driver2.length)
{
markup += '<tr><td>'+driver1[i].+'</td><td>'+driver2[i]+'</td><tr>';
}
else
{
markup += '<tr><td>'+driver1[i].+'</td><td></td><tr>';
}

}

  $('#table-allDrivers tbody').append(markup);

我认为这将显示正确的结果，即使这不是最好的方法，但我尝试了尽可能多的信息。

推荐阅读