隐藏/显示具有特定类的表行,直到具有不同类名的另一行?
问题描述:
我有要显示和隐藏的行,但只能到下一个第一级行。我的代码是切换所有第二级行,而不是直到下一个第一级行。
I have rows I want to show and hide, but only up until the next first-level row. My code is toggling all of the second-level rows instead of the ones up until the next first-level row.
当你点击class行的行时-level,我希望每一行都有类二级,直到下一个第一级实例切换为止。
When you click on a row with the class "first-level", I would like every row with the class "second-level" up until the next instance of "first-level" to toggle.
<table>
<tbody>
<tr class="first-level">
<td>First Level</td>
<td>First Level</td>
<td>First Level</td>
<td>First Level</td>
<td>First Level</td>
</tr>
<tr class="second-level">
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
</tr>
<tr class="second-level">
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
</tr>
<tr class="second-level">
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
</tr>
<tr class="first-level">
<td>First Level</td>
<td>First Level</td>
<td>First Level</td>
<td>First Level</td>
<td>First Level</td>
</tr>
<tr class="second-level">
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
</tr>
<tr class="second-level">
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
</tr>
<tr class="second-level">
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
<td>Second Level</td>
</tr>
</tbody>
</table>
js:
var firstLevel = $('.first-level')
var secondLevel = $('.second-level')
$(firstLevel).click(function() {
$(secondLevel).nextUntil(firstLevel).toggle("slow");
});
答
您需要从点击的元素开始:
You need to start at the element clicked:
$('.first-level').click(function() {
$(this).nextUntil('.first-level').toggle("slow");
});
传递整个集合只是不起作用,因为没有单一的参考点可以从
Passing in the whole collection just won't work as there is no single point of reference to start from