Question

我有一个包含5列的宽数据表，当用户点击“打印”链接时，该表应该将第3和第4个td的内容合并为1 td以节省空间。

<table>
<thead>
    <th>1</th>
    <th>2</th>
    <th>3</th>
    <th>4</th>
    <th>5</th>
</thead>
<tbody>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
    </tr>
</tbody>
</table>

请帮忙。

Answer 1

$("tr td:nth-child(3)").each(function()
{
    var t = $(this);
    var n = t.next();
    t.html(t.html() + n.html());
    n.remove();
});

Answer 2

像这样简单快捷......

$('table tr > :nth-child(3)').append(function() {
    return $(this).next().remove().contents();
});

DEMO： http://jsfiddle.net/3eDLS/

Answer 3

这样的事情：

$('table').find('th, td').filter(':nth-child(3)').append(function() {
    return $(this).next().html();
}).next().remove();

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

Answer 4

这是一个棘手的问题。我能做的最好：http://jsfiddle.net/mnbayazit/HbPrw/

$('button').click(function() {
    $('tbody tr').each(function() {
        $('td:eq(1)', this).after('<td>' + $('td:eq(2)', this).html() + $('td:eq(3)', this).html() + '</td>');
        $('td:eq(3),td:eq(4)', this).remove();
    });
});

（错误......我故意离开了thead，但现在发生这种情况，毕竟这可能是不受欢迎的）

使用jQuery将multiple合并为1

4 个答案: