将 Jquery 手风琴扩展到表的行 [英] Extending Jquery accordion to rows of a table

问题描述

我有一个带有可折叠行的表格.请查看此处

I have a table with collapsible rows. Please check here

我只想使用 Jquery UI 手风琴，如此处

I just want to use the Jquery UI accordion as shown here

我正在尝试将手风琴应用于以下结构:

I am trying to apply accordion to the below structure :

<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>

我知道有序列表最适合这种类型的结构.但是由于一些限制，需要使用表.

I understand that ordered list is most suitable for this type of structure.But due to some restrictions, table needs to be used.

请提出建议.

推荐答案

使用 header 手风琴选项:

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

https://jsfiddle.net/c1j7xbkp/

这篇关于将 Jquery 手风琴扩展到表的行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！