html - 要素を使用せずに HTML テーブルがコンテンツを新しい行にプッシュする

Question

ヘッダーによってソート可能な表形式のデータが表示されます。これにはTable Sorterプラグインを使用しています。各行には、各行のすぐ下で開閉する折りたたみ可能なパネルもあります。現在、これらのパネルを<tr>jQuery によって表示/非表示される要素として実装しています。ただし、この実装では、テーブル ソーターが列を並べ替えるときに、これらのパネルも並べ替えられます。

各行のすぐ下に折りたたみ可能なパネルを表示する別の方法は何ですか?

Answer 1

HTML仕様ではtbody、テーブル内に複数のを許可しています。tbody各行に1を使用する必要があると思います（複数の行を持つことができますtr）。

<table>
  <thead></thead>
  <tbody>
    <tr><!-- 1st row with data columns --></tr>
    <tr><!-- 2nd row which is hidden and with the data that gets shown after expanding --></tr>
  </tbody>
  <tbody><!-- similar to the first tbody --></tbody>
  <tfoot></tfoot>
</table>

また、Tablesorterプラグインが正しく実装されていません。代わりにフォークを使用してみてください-https://github.com/renatoalbano/jquery-tablesorter/

---

参照：https ：//developer.mozilla.org/en/HTML/Element/table