jQuery 需要根据 rowspan 循环下一个元素

Question

好吧，基本上，我有一个像这样设置的表格，但是 元素可以有任意数量的行跨度...

<table width="100%">
    <tr class="tablerow0">
        <td class="tablecol_0" colspan="4">Content</td>
    </tr>
    <tr class="tablerow1">
        <td class="tablecol_0" rowspan="2">More Content</td>
        <td class="tablecol_1" colspan="3">Some More Content</td>
    </tr>
    <tr class="tablerow2">
        <td class="tablecol_1">And Yet More Content</td>
        <td class="tablecol_2">Content</td>
        <td class="tablecol_3">Content</td>
    </tr>
</table>

好吧，所以我想做的是确定行数rowspans 可以像这样完成：

$("td").each(function() {
    $(this).attr('rowspan');
});

但是对于每个大于 1 的 rowspans，我需要从每个函数中返回 false。例如，当它找到 rowspan 为 2 的元素时，它不应该继续到下一个元素，因为rowspan 附加到下一个元素。但更重要的是，我需要循环遍历 元素的行跨度。

例如，如果我有这个表设置：

<table width="100%">
    <tr class="tablerow0">
        <td class="tablecol_0" rowspan="2">Content</td>
        <td class="tablecol_1">Content</td>
        <td class="tablecol_2">Content</td>
    </tr>
    <tr class="tablerow1">
        <td class="tablecol_1">More Content</td>
        <td class="tablecol_2">Some More Content</td>
    </tr>
    <tr class="tablerow2">
        <td class="tablecol_1">And Yet More Content</td>
        <td class="tablecol_2">Content</td>
        <td class="tablecol_3">Content</td>
    </tr>
</table>

那么它需要使用 class="tablerow2" 获取这里的最后一个 因为 rowspan 仅覆盖 tablerow0 和 tablerow1。

希望您明白我的意思，它需要能够在 元素中循环，并且仅在超出这些 rowspan 数量时执行某些操作表中的 > 元素。行跨度可以超过 2，我只是对其进行简化，以便人们理解我在这里要问的内容。此外，可能有超过 1 个 元素的 rowspan 大于 1，因此它也应该能够知道这一点。我想我需要在这里构建一个 rowspan 数组，并且数组长度将基于每个 rowspan 值。

Answer 1

//cache the tr elements to loop through them
var $TRs = $('tr');

//this type of loop will perform quickly
for (var i = 0, len = $TRs.length; i < len; i++) {

    //check to make sure the last TR element doesn't have a TD child element with a rowspan attribute
    if (i == 0 || $TRs.eq(i - 1).children('[rowspan]').length == 0) {
        //we are on the first TR element or the previous TR element does not have a child TD element with a rowspan attribute
    }
}

您还可以将 [rowspan] 更改为 [rowspan=2] 以检查特定的 rowspan 值。

这是一个演示： http://jsfiddle.net/JyQYW/

更新

这是一个简单的检查示例对于超过 rowspan=2：

if (i == 0 || ($TRs.eq(i - 1).children('[rowspan=2]').length == 0 && (i > 1 && $TRs.eq(i - 2).children('[rowspan=3]').length == 0)) && (i > 2 && $TRs.eq(i - 3).children('[rowspan=4]').length == 0))) {

新代码会检查以确保向下有足够的行，然后检查最后三行是否影响当前行。