将Jquery手风琴扩展为表格的行

时间:2013-04-16 20:39:34

标签: jquery html-table accordion

我有一张可折叠行的表格。请检查here

我只想使用如here

所示的Jquery UI手风琴

我正在尝试将accordion应用于以下结构:

<table>
    <tbody class="category">
        <tr><td>Category - 1</td></tr>
    </tbody>
    <tbody class="subcategory">
        <tr><td>Sub Cateogry 1.1</td></tr>
        <tr><td>Sub Cateogry 1.2</td></tr>
    </tbody>
    <tbody class="category">
       <tr><td>Category - 2</td></tr>
    </tbody>
    <tbody class="subcategory">
       <tr><td>Sub Cateogry 2.1</td></tr>
    </tbody>
</table>

据我所知,有序列表最适合这种类型的结构。但由于某些限制,需要使用表格。

请建议。

1 个答案:

答案 0 :(得分:7)

使用手风琴的header选项:

$(document).ready(function () {
    $('table').accordion({header: '.category' });
});

https://jsfiddle.net/c1j7xbkp/