javascript - 单击一个元素后选择接下来的两个元素。 (jquery)

Question

我有这样一张表:

<table>
<tbody>
<tr class='clickme'>
<td>...</td>
</tr>
<tr class='hidden1'>
<td>...</td>
</tr>
<tr class='hidden2'>
<td>...</td>
</tr>
<tr class='clickme'>
<td>...</td>
</tr>
<tr class='hidden1'>
<td>...</td>
</tr>
<tr class='hidden2'>
<td>...</td>
</tr>
[etc.]
</tbody>
</table>

.hidden1 和 .hidden2 显示:无。我的目标是点击 clickme 并显示接下来的两个，但只有那两个，而且只有我点击的 clickme“下面”的那些。

我试过最接近的:

$('.clickme').click(function (e) {
    $(this).closest('.hidden1').remove();
    $(this).closest('.hidden2').remove();
});

没有回应。多种不同的东西。我尝试了 siblings 并取得了一定的成功，但它只显示了整个表格中的第一场比赛。该表可能有 100 个这样的对。

$('.clickme').click(function (e) {
        $(this).siblings(".hidden1:first").toggle(); 
        $(this).siblings(".hidden2:first").toggle(); 
    });

我很难过，我觉得这是一个非常简单的解决方案!

Answer 1

对于您的标记，使用 .nextUntil() 很容易:

$(".clickme").click(function() {
    $(this).nextUntil(".clickme").toggle();
});

演示: http://jsfiddle.net/XEF2v/

如果中间可能有其他行，您可以使用 .filter() 过滤它们:

$(this).nextUntil(".clickme").filter(".hidden1, .hidden2").toggle();