javascript - 切换每个表行，直到到达具有 X 类的表行

Question

我正在将 Accordion 效果集成到表格中。

具有“more”类的表行是上述表行的子行。单击该表行时，我希望切换“更多”tr。我如何只定位这些表格行而不是常规的“行”表格行。

        <tr class="row first">
            <td>
                <span class="time">09.00&ndash;09.15</span>
                <h3>
                    Welcome and introduction</h3>
            </td>
            <td>
                person info</td>
        </tr>
        <tr class="row">
            <td>
                <span class="time">09.00&ndash;09.15</span>
                <h3>
                    Welcome and introduction</h3>
            </td>
            <td>
                person info</td>
        </tr>


        <tr class="more">
            <td>
                <h3>
                    hidden content</h3>
            </td>
            <td>
                person info</td>
        </tr>
        <tr class="more">
            <td>
                <h3>
                    hidden info</h3>
            </td>
            <td>
                person info</td>
        </tr>
            </div>

        <tr class="row">
            <td>
                <span class="time">09.00&ndash;09.15</span>
                <h3>
                    Welcome and introduction</h3>
            </td>
            <td>
                person info</td>
        </tr>
        <tr class="row break">
            <td>
                <h3>
                    10.50&ndash;11.20 Coffee break</h3>
            </td>
            <td>
                &nbsp;</td>
        </tr>

Answer 1

使用 .nextUntil() 的组合和:不是。

$("table tr.row").each(function(){
  var $this = $(this);
  $this.click(function(){
    $this.nextUntil(":not(.more)").toggle();
  });
});

选择器 :not(.more) 匹配所有不包含 more 类名的元素。

See it here.