javascript - 表上的 jQuery slideToggle 滞后然后切换(无幻灯片)

Question

我有一个表格，其中包含一个标题行、一个“项目”行(如果您愿意的话)和一个详细信息行。项目行和详细信息行将重复，因此表中的每个偶数行(即表中的第二行是第一个“项目”行)将是一个项目行，每个奇数行将是一个“详细信息”行，标题除外。

下面的脚本有效，除了 jQuery slideToggle 没有滑动。在展开 Action 时，它只是打开，在折叠 Action 时它需要一秒钟然后消失。

请参阅下面的表结构和脚本:jsFiddle (点击“列[1,2,3]行)

<script type="text/javascript">
    $(document).ready(function () {
    $("#sometable tr:odd").addClass("odd");
    $("#sometable tr:not(.odd)").hide();
    $("#sometable tr:first-child").show();

    $("#sometable tr.odd").click(function () {
        $(this).next("tr").slideToggle("slow");
    });
});

<table id="sometable">
<tr>
    <th>
        Header1
    </th>
    <th>
        Header2
    </th>
    <th>
        Header3
    </th>
</tr>
<tr>
    <td>
        Column1
    </td>
    <td>
        Column2
    </td>
    <td>
        Column3
    </td>
</tr>
<tr>
    <td colspan="3">
        <p>Details about item 1</p>
    </td>
</tr>

Answer 1

slideToggle 不适用于 tr。我相信这与 overflow: hidden 不与 tr 一起工作有关。

最简单的解决方法是简单地 slideToggle p 而不是 tr。

http://jsfiddle.net/hEyDN/4/