的jQuery的slideToggle桌子上

Question

<table id="main_table">  
     <tr style="background-color:green; color:white"> 
      <td class="flip"> Section 1 </td> 
     </tr> 
    <tr> 
     <td> 
      <table class="section"> 
       <tr> 
        <td>item 111</td> 
        <td>item 112</td> 
        <td>item 113</td> 
        <td>item 114</td> 
       </tr> 
      </table> 
     </td> 
    </tr> 
</table> 

$('.flip').click(function() { 
    $(this) 
     .closest('table') 
     .next('.section') 
     .toggle('fast'); 
}); 

有人可以幫我糾正上面的代碼 我試過的slideToggle但不知道爲什麼它不工作

感謝

Answer 1

的section元素是下一個tr元素的子

$('.flip').click(function() { 
    $(this) 
     .closest('tr').next() 
     .find('.section') 
     .toggle('fast'); 
}); 

演示：Fiddle

Answer 2

您可以使用tr代替table獲得下一行並使用find()獲得.section

$('.flip').click(function() { 
    $(this) 
     .closest('tr') 
     .next('tr') 
     .find('.section') 
     .toggle('fast'); 
}); 

Answer 3

試試這個

$('.flip').on('click',function() { 
$(this) 
.closest('tr').next('tr') 
.find('.section') 
.toggle(200); 
}); 

Reference