Question

我有一个表格，它有一个标题行，一个“项目”行，如果你愿意，还有一个详细信息行。项目行和详细信息行将重复，以便表格中的每个偶数行（即表格中的第二行是第一个“项目”行）将是项目行，每个奇数编号将是“详细信息“行，标题除外。

下面的脚本有效，但jQuery slideToggle没有滑动。在展开操作上，它只是打开，在崩溃操作上需要一秒钟然后消失。

请参阅下面的表格结构和脚本：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/

jQuery slideToggle on table lags然后切换（没有幻灯片）

1 个答案: