jquery nextAll 并跳过第一个元素

Question

我需要在每个具有“topRow”类的 TR 的第一个子 TD 上添加一个点击事件，该事件会切换具有“subRow”类的所有下一个 TR 行，跳过 TR.topRow 下的第一个 TR。

表格示例

<table>
    <tr class="topRow">
        <td>text</td>
        <td>Text</td>
        <td>Text</td>
    </tr>
    <tr class="otherRow">
        <td colspan="3">Text</td>
    </tr>
    <tr class="subRow">
        <td>text</td>
        <td>Text</td>
        <td>Text</td>
    </tr>
    <tr class="subRow">
        <td>text</td>
        <td>Text</td>
        <td>Text</td>
    </tr>
    <tr class="topRow">
        <td>text</td>
        <td>Text</td>
        <td>Text</td>
    </tr>
    <tr class="otherRow">
        <td colspan="3">Text</td>
    </tr>
    <tr class="topRow">
        <td>text</td>
        <td>Text</td>
        <td>Text</td>
    </tr>
    <tr class="otherRow">
        <td colspan="3">Text</td>
    </tr>
    <tr class="subRow">
        <td>text</td>
        <td>Text</td>
        <td>Text</td>
    </tr>
    <tr class="subRow">
        <td>text</td>
        <td>Text</td>
        <td>Text</td>
    </tr>
    <tr class="subRow">
        <td>text</td>
        <td>Text</td>
        <td>Text</td>
    </tr>
    <tr class="subRow">
        <td>text</td>
        <td>Text</td>
        <td>Text</td>
    </tr>
</table>

我现在有jquery

$("tr.topRow td:first-child").click(function () {
    $(this).parent().nextUntil('tr:not(tr.subRow):gt(1)').slideToggle();
});

我尝试过的另一件事

$("tr.topRow td:first-child").click(function () {
    $(this).parent().nextUntil('tr:gt(1):not(tr.subRow):gt(1)').slideToggle();
});

但我没有得到所需的结果。

Answer 1

你可以直接抛出 .next()在那里进行跳过(这也简化了事情)，如下所示:

$("tr.topRow td:first-child").click(function () {
  $(this).parent().next().nextUntil('tr.topRow').slideToggle();
});

You can test it out here .