2

我有一张桌子

<table>
<tr><td>9:00</td><td id='ts9'>task1</td></tr>
<tr><td>10:00</td><td id='ts10'></td></tr>
<tr><td>11:00</td><td id='ts11'>task2</td></tr>
<tr><td>12:00</td><td id='ts12'>task3</td></tr>
</table>

我需要将 id 为 10 和 11 的单元格合并为一个，因为该任务需要 2 小时。我正在使用 jQuery。

我想过：

$("#ts9").attr('colSpan', 2);

但它不会工作。

4

3 回答 3

4

如果你必须使用 jQuery，那么这可行：

$('#ts10')
    .text($('#ts11').text())
    .attr('rowspan','2')
    .closest('tbody')
    .find('#ts11')
    .remove();​

JS 小提琴演示。

或者，更简洁一些：

$('#ts10')
    .text($('#ts11').remove().text())
    .attr('rowspan','2');​

JS 小提琴演示。

还有一种更...有用的方法，它将相邻行的单元格与 ofclass合并two：

$('tr td.two').each(
    function(){
        var that = $(this),
            next = that.parent().next().find('.two');
        if (next.length){
            that
                .text(next.remove().text())
                .attr('rowspan','2');
        }
    });

JS 小提琴演示。

于 2012-04-18T22:59:13.717 回答
2

这对我有用。合并具有相同文本的单元格：逻辑：对于每个单元格，如果下一个单元格相同的文本，则删除下一个单元格，增加 colSpan。（注意“colSpan”，而不是“colspan” - 显然是浏览器兼容性问题）

$('#tblData tbody tr:first-child td').each(function(){
 var colSpan=1;
 while( $(this).text() == $(this).next().text() ){
  $(this).next().remove();
  colSpan++;
 }
$(this).attr('colSpan',colSpan);
});
于 2012-07-31T21:11:55.417 回答
0

您实际上需要将rowspan 添加到 ds10 ，然后从此处的第二行中删除ts11 。将代码从 colspan 更改为 rowspan，添加以下内容

$("#ts11").remove();

你应该得到你需要的结果。但我个人并没有尝试通过 jquery 更改 rowspan/colspan 属性，我只是假设它运行良好。希望能帮助到你。

ps：更正的数字，认为你需要先合并 9 和 10 :)

于 2012-04-18T22:57:25.667 回答