单击一个后选择下两个元素。 （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是display：none。我的目标是点击clickme并显示接下来的两个，但只显示那两个，并且只显示我点击的clickme下面的那些。

我试过最近的：

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

没有回应。多种不同的东西。我尝试了中等成功的兄弟姐妹，但它只显示了整个表格中的第一场比赛。该表可以有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();
});

DEMO： http://jsfiddle.net/XEF2v/

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

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

Answer 2

如果您在以下".clickme"之前有其他不想选择的元素，因此无法使用VisioN的解决方案，您可以：

$('.clickme').click(function (e) {
    $(this).nextAll(".hide1").eq(0).toggle(); 
    $(this).nextAll(".hide2").eq(0).toggle(); 
});