Question

我有一个带有tr标签的表。我希望它的类并排显示两个tr标签。我怎么能用jquery做到这一点。

<table>
   <tr class='1'>
     <td>First</td>
   </tr>
   <tr class='1'>
      <td>second</td>
   </tr>
   <tr class='2'>
       <td>third</td>
   </tr>
   <tr class='3'>
       <td>fourth</td>
   </tr>
   <tr class='3'>
       <td>fifth</td>
   </tr>  
</table>

然后在输出中我想显示

 First     Second
 Third
 Fourth    Fifth

我想动态设置它们如何使用jquery或javascript来做到这一点。我想使用为tr标签声明的类。我知道想要使用<td>标签。任何帮助表示赞赏

Answer 1

这是我想到的第一种方式：

var $tds = $("td");      // get all the tds
[].reverse.call($tds);   // reverse the order so we can easily loop backwards

$tds.each(function() {
    var $parentRow = $(this).parent(),
        // find the first row with the same class that isn't this row
        $firstTrSameClass = $("tr").filter("." +$parentRow.attr("class"))
                                   .not($parentRow).first();
    if ($firstTrSameClass.length > 0) { // if there is such a row
        $firstTrSameClass.append(this); // move the td
        $parentRow.remove();            // delete the original row
    }   
});

演示：http://jsfiddle.net/pgcdq/

Answer 2

我无法在这里看到一个用例，但我想最简单的方法是创建新行并将单元格移动到它们。您可以在此处找到有关移动元素的信息： How to move an element into another element?

如何通过id在同一行显示两个tr的id

2 个答案: