javascript - 表格行的 slideToggle

Question

根据 this post滑动效果现在适用于表格。我正在尝试找出一种在下面的代码中实现 slideToggle 功能的方法。

下面的代码正确地删除/显示了指定的内容，但它不是通过滑动来完成的。

jsfiddle位于上面的帖子通过放置 div 解决了他们的情况。在 td 内，所以对于我的情况，我尝试放置一个 div在<tr>里面解决我的情况，但它没有用。

$(".one").on('click', function() {
    $(this).nextAll('.two:first').slideToggle(); 
}); 

.one{
    background: orange;
    cursor: pointer;
}
.two{
    background: yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
    <tr class="one">
        <td> Hello </td>
    </tr>
     <tr>
        <td> world </td>
    </tr>
    <tr class="two">
        <td> Foo <br> foo </td>
    </tr>
    <tr class="two">
        <td> Bazz </td>
    </tr>
    <tr class="one">
        <td> Hello </td>
    </tr>
    <tr class="two">
        <td> Bar<br>bar </td>
    </tr>
</table>

Answer 1

您需要将 td 元素中的内容包装在 div 中，然后您可以:

$(this).nextAll('.two:first').find('div').slideToggle();

DEMO