在跨 3 列的单元格上使用 slipToggle

Question

我正在尝试创建一个表格，而当用户单击其中一行时，一个块将沿着表格的相同长度滑动。我尝试使用 div，但我想除非在单元格内部，否则表格中的任何位置都不能有 div。这是我当前的代码：

<table class="table-carrier">
        <thead>
            <tr>
                <th>
                    <%= Html.Encode(SFSys.Inst.I18n.GetText("Name")) %>
                </th>
                <th>
                    <%= Html.Encode(SFSys.Inst.I18n.GetText("Value")) %>
                </th>
                <th><!-- Data to be added later --></th>
            </tr>
        </thead>
        <% foreach (var Carrier in ViewData.Model.Carriers) {  %>
        <tbody>
            <tr>
                <td class="carrier-row" onclick="$(this)
                .closest('tbody')
                .next('.section')
                .slideToggle('fast');">
                    <%= Html.Encode(Carrier.Name) %>
                </td>
                <td>
                    <%= Html.Encode(Carrier.Value) %>
                </td>
                <td>
                    <%using(Html.BeginForm("Action", "Form")) {%>
                        <input type="hidden" name="FormKey" id="FormKey" value="<%= this.Request.Url.Query %>" />
                        <input type="submit" name="action" value="<%= Html.Encode(SFSys.Inst.I18n.GetText("Change")) %>" onclick='scriptForward = true' />
                    <%}%>
                </td>
            </tr>
            </tbody>
            <tbody class="section">
            <tr>
                <td colspan="3">
                    <div >
                        <table>
                            <tr>
                                <td>left 1</td>
                                <td>right 1</td>
                            </tr>
                            <tr>
                                <td>left 2</td>
                                <td>right 2</td>
                            </tr>
                        </table>
                    </div>
                </td>
            </tr>
            </tbody>
        <% } %>
    </table>

我能够让每个部分单独出现，但是当它这样做时，它会更改我的表格，将信息从一个单元格向下滑动，然后将其拉伸。有没有办法让信息沿着表格的长度向下滑动？

Answer 1

尽管我无法找到合适的解决方案，但使用 jQuery Accordion 对象设法创建了我正在寻找的内容。有关详细信息，请访问 jQuery Accordion