Jquery 滑动将多个元素作为一个元素

我试图将

slideUp（）

表行作为一个元素，将另一行作为不同的元素

示例-我有这样的东西：

<table>
  <tr> .. </tr> <!-- slideUp -->
  <tr> .. </tr> <!-- slideUp -->
  <tr> .. </tr> <!-- I will click on this -->
  <tr> .. </tr> <!-- slideUp -->
  <tr> .. </tr> <!-- slideUp -->
</table>

..  
..  
..  
..  
..  

但是我不想将每一行滑动为元素，而是将每一行分组为一个元素

另一个例子：附言：我可以点击任何DIV单击后，后面的每个div将作为一个元素，后面的每个div将作为一个元素

..  
..  
..  
..  
..  

我想让它像这样运行（但这不是有效的HTML）：

<table>
   <div class="this-will-slide-up> 
       <tr> .. </tr>
       <tr> .. </tr>
       <tr> .. </tr>
   </div>
   <div class="I-will-click-on-this>
       <tr> .. </tr>
   </div>
   <div class="this-will-slide-up> 
       <tr> .. </tr>
       <tr> .. </tr>
       <tr> .. </tr>
   </div>
</table>

<script>
   $('I-will-click-on-this').click(function() {
      $('this-will-slide-up').slideUp();
   });
<script>

.. 
你可以用

获取每个元素的以下所有同级，直到但不包括通过选择器、DOM节点或jQuery对象匹配的元素


$（'.I-will-click-on-this'）。单击（函数（）{
$（this）.nextUntil（'.I-will-click-on-this'）.slideToggle（）；
});

我会点击这个
xxxx
xxxx
xxxx
xxxx
xxxx
我会点击这个
xxxx
xxxx
xxxx
xxxx
xxxx
您可以使用

获取每个元素的以下所有同级，直到但不包括通过选择器、DOM节点或jQuery对象匹配的元素


$（'.I-will-click-on-this'）。单击（函数（）{
$（this）.nextUntil（'.I-will-click-on-this'）.slideToggle（）；
});

我会点击这个
xxxx
xxxx
xxxx
xxxx
xxxx
我会点击这个
xxxx
xxxx
xxxx
xxxx
xxxx
无效的HTML as
表
不能将
div
作为其直接子元素。看看你为什么不用
divs
@Satpal修改你的html代码他写的他知道，我想这只是为了演示我也不知道如何用html来做。我需要它。我将在divsInvalid HTML中添加示例，因为
table
不能将
div
作为其直接子元素。看看你为什么不用
divs
@Satpal修改你的html代码他写的他知道，我想这只是为了演示我也不知道如何用html来做。我需要它。我将在divsThank you中添加示例以了解想法，但不可能动态地执行此操作。我需要的是javascript解决方案，而不是HTML:（很好！：）Tyvm我对这个函数不太了解，一点也不了解。我没有看到任何“幻灯片”动画。它只是毫无疑问地消失了o（但应该有一些）这正是问题所在，但我必须将所有行作为一个div来“slideUp”。@Jax-p，表行的创建问题请参见我用divone更新了答案！现在工作很好。谢谢你的想法，但这是不可能做到的动态。我需要的是javascript解决方案，而不是HTML:（很好！：）Tyvm我对这个函数不太了解，一点也不了解。我没有看到任何“幻灯片”动画。它只是毫无疑问地消失了o（但应该有一些）这正是问题所在，但我必须将所有行作为一个div来“slideUp”。@Jax-p，表行的创建问题请参见我用divone更新了答案！现在工作很顺利。
<table>
   <div class="this-will-slide-up> 
       <tr> .. </tr>
       <tr> .. </tr>
       <tr> .. </tr>
   </div>
   <div class="I-will-click-on-this>
       <tr> .. </tr>
   </div>
   <div class="this-will-slide-up> 
       <tr> .. </tr>
       <tr> .. </tr>
       <tr> .. </tr>
   </div>
</table>

<script>
   $('I-will-click-on-this').click(function() {
      $('this-will-slide-up').slideUp();
   });
<script>