分組嵌套表格行

在HTML表格中分組表格行的最佳方式是什麼？有些分組應該是嵌套的，所以使用<tbody>不是理想的解決方案（它們不應被嵌套）。分組嵌套表格行

我的數據格式如下：

 
Level 1 
Level 1 
    Level 2 
    Level 2 
     Level 3 
      Level 4 
     Level 3 
     Level 3 
    Level 2 
Level 1 
    Level 2 
     Level 3 
      Level 4 
      Level 4 
     Level 3 
    Level 2 
     Level 3

我想實現：

明智的文檔結構，易於閱讀
到目前爲止，我所取得的「易於閱讀'部分與不同級別的css
一些嵌套的級別可能需要可摺疊，所以分組會使（？）更容易。它必須工作，以便緊隨任何特定更高級別之後的嵌套級別將通過某種機制（最有可能點擊）崩潰。不知道這崩潰多少意義，但它可能是要求之一。

該表是在JavaScript中生成的（來自具有嵌套結構的JSON對象），所以我可以對它做各種各樣的魔法。這些數據代表了財務資產負債表，有時您可能希望顯示/隱藏任何特定數據行的更多詳細信息，因此可以嵌套。

來源

2014-06-27 wojrze

你見過bootstrap [collapsible]（http://getbootstrap.com/2.3.2/javascript.html#collapse） –

我不確定這是否可行。數據表示資產負債表，因此數據必須採用表格格式 – wojrze

該問題描述了「水平」的抽象結構。裏面沒有什麼像桌子一樣的東西。這個問題既含糊又太寬泛（要求人們設計非常鬆散的標記結構）。 –

你可以嘗試垂直菜單，也將有水平和可摺疊面板了。有這麼多的模板可用。只是一個想法。

來源

2014-06-27 09:30:09 Hima

我認爲在HTML中沒有這樣做的好方法。我會使用JQuery Datatable。

http://jquery-datatables-row-grouping.googlecode.com/svn/trunk/customGroupOrdering.html

試着看一下這個例子

來源

2014-06-27 09:34:38 Izekid

我來到了同樣的問題來解決，這是我的解決方案，我希望它會幫助..

對我來說是添加的東西幾個屬性（rowname, parent, state）到表格的每一行。狀態屬性可以是「打開」,「摺疊」或「葉」。然後，兩個JavaScript函數將實現這一魔術，請參閱工作fiddle。

來源

2014-08-12 15:00:54 krpec

分組嵌套表格行

回答

相關問題