jquery - colspane 克隆行的所有列

Question

我想将所有列合并到使用jquery 方法(colspan)创建的新行中。clone()我希望新行之后只有一列的另一件事colspan应该将原始行的所有值用空格分隔。

我已经尝试过这样的事情，clone并且它对我的工作到目前为止考虑cloning

$(document).ready(function(){
 console.log($('table tbody tr').eq(0).html());
 var newtr=$('table tbody tr').eq(0).clone();
 console.log(newtr.html());
});

但不知道如何将colspan所有具有原始行逗号值的列分开。

JS 小提琴链接

已编辑

当前的html是这样的

<table>
    <thead>
        <tr>
            <th>Name</th>
            <th>Order</th>
            <th>Month</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Rahul</td>
            <td>#1</td>
            <td>January</td>
        </tr>
        <tr>
            <td>Yunus</td>
            <td>#2</td>
            <td>April</td>
        </tr>
        <tr>
            <td>Nitin</td>
            <td>#3</td>
            <td>March</td>
        </tr>
    </tbody>
</table>

在 jquery 代码运行之后，我希望我的结果 html 看起来像这样

<table>
    <thead>
        <tr>
            <th>Name</th>
            <th>Order</th>
            <th>Month</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Rahul</td>
            <td>#1</td>
            <td>January</td>
        </tr>
        <tr>
            <td>Yunus</td>
            <td>#2</td>
            <td>April</td>
        </tr>
        <tr>
            <td>Nitin</td>
            <td>#3</td>
            <td>March</td>
        </tr>
        <tr>
            <td colspan="3">Rahul #1 January</td>
        </tr>
    </tbody>
</table>

Answer 1

$("table tbody tr:eq(0)").each(function() {
    var $tr = $(this).clone(),
        $td = $("td", $tr);

    $td.filter(":gt(0)")
       .remove()
       .end()
       .attr("colspan", $td.length)
       .html($td.map(function() {
           return this.innerHTML;
       }).get().join(" "));

    $tr.appendTo($(this).closest("tbody"));
});

演示：http: //jsfiddle.net/uAwnQ/2/

Answer 2

我应该做这样的事情：

var $tr = $("table tbody tr:first").clone(),
$td = $("td", $tr);

var content = '';
$td.each(function(){content+=$(this).html()+' ';});
content = '<td colspan="'+$td.length+'">'+content+'</td>';
$tr.html(content);

$tr.appendTo("table tbody");

如果需要另一行，您可以将:first选择器更改为eq() 。如果要影响多行，则可以使用.each()

演示 http://jsfiddle.net/f932M/1/