如何浮動使用Javascript或jQuery的

Question

我想漂浮最後2列，如「輸出2」，我可以浮表像「輸出1」表的表最後兩列結束，是有可能上浮表 如「輸出2」。

爲了得到輸出1，我計算列號，然後當涉及到第3列時，我將唯一的ID添加到列 之後，我使用該ID分割行。

請別人指教我如何顯示錶格，如「輸出2」。

原始編碼：

<table> 
    <tr> 
     <td>row 1 col 1</td> 
     <td>row 1 col 2</td> 
     <td>row 1 col 3</td> 
     <td>row 1 col 4</td>   
    </tr> 
    <tr> 
     <td>row 2 col 1</td> 
     <td>row 2 col 2</td> 
     <td>row 2 col 3</td> 
     <td>row 2 col 4</td>  
    </tr>  
    <tr> 
     <td>row 3 col 1</td> 
     <td>row 3 col 2</td> 
     <td>row 3 col 3</td> 
     <td>row 3 col 4</td>   
    </tr>  
</table> 

輸出1：

<table> 
    <tr> 
     <td>row 1 col 1</td> 
     <td>row 1 col 2</td> 
    </tr> 
    <tr> 
     <td>row 1 col 3</td> 
     <td>row 1 col 4</td>   
    </tr> 
    <tr> 
     <td>row 2 col 1</td> 
     <td>row 2 col 2</td> 
    </tr> 
    <tr> 
     <td>row 2 col 3</td> 
     <td>row 2 col 4</td>  
    </tr>  
    <tr> 
     <td>row 3 col 1</td> 
     <td>row 3 col 2</td> 
    </tr> 
    <tr> 
     <td>row 3 col 3</td> 
     <td>row 3 col 4</td>   
    </tr>  
</table> 

輸出1：jQuery代碼

<script type="text/javascript"> 
     $('td').each(function(){ 

       var col = $(this).parent().children().index($(this)); 
       var row = $(this).parent().parent().children().index($(this).parent()); 

       if(col == 2){ 
        var newid = "breakId"+row+""+col; 
        $(this).attr('id', newid); 
        var boundary = $("#"+newid); 
        $("<tr>").insertAfter(boundary.parent()).append(boundary.nextAll().andSelf());  
       } 
     }); 
</script> 

輸出2：

<table> 
    <tr> 
     <td>row 1 col 1</td> 
     <td>row 1 col 2</td> 
    </tr> 
    <tr> 
     <td>row 2 col 1</td> 
     <td>row 2 col 2</td> 
    </tr> 
    <tr> 
     <td>row 3 col 1</td> 
     <td>row 3 col 2</td> 
    </tr> 

    <tr> 
     <td>row 1 col 3</td> 
     <td>row 1 col 4</td>   
    </tr>  
    <tr> 
     <td>row 2 col 3</td> 
     <td>row 2 col 4</td>  
    </tr>  
    <tr> 
     <td>row 3 col 3</td> 
     <td>row 3 col 4</td>   
    </tr>  
</table> 

Answer 1

$('tr').each(function(){    
    var cell3 = $(this).find("td:eq(2)"); 
    var cell4 = $(this).find("td:eq(3)"); 
    var newRow = "<tr></tr>"; 
     newRow= $(newRow).append(cell3); 
     newRow= $(newRow).append(cell4); 
    $("#table_id").append(newRow);  
}); 

你的HTML表格的table_id =標識

jsfiddle