將jquery手風琴延伸到表格的行

Question

我有一個可摺疊行的表格。請檢查here

我只是想使用jQuery UI的手風琴如圖here

我想申請手風琴結構如下：

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

據我所知，有序列表是最適合這種類型的結構。但由於某些限制，需要使用表格。

請建議。

Answer 1

使用header選項手風琴：

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

https://jsfiddle.net/c1j7xbkp/