带数据表插件的可折叠表

Question

我正在使用data table plug-in进行分页。现在我想点击桌子的每一行都有可折叠的功能......

这是我的代码片段：

 <tr class="outer-tr">
     <td>1</td>
     <td>pppol</td>
     <td>Approved</td>
</tr>
<tr class="inner-tr"> 
       <td>show-hide</td> 
</tr> 

我在点击inner-tr时隐藏/显示outer-tr 但它给出了一个错误：

 Uncaught TypeError: Cannot read property 'className' of undefined 

我知道这是因为表格格式不正确而发生的。
 

有关使用数据表插件实现可折叠表的任何建议???

Answer 1

在代码中添加jquery脚本：

$(function() {  
   $('.outer-tr').click(function() {
      $('.outer-tr td').toggleClass('visible');
   });
   $('.inner-tr').click(function() {
      $('.inner-tr td').toggleClass('visible');
   });
});

还要添加css样式

tr td{display: none;}
tr td.visible{display: block;}

Answer 2

JQuery DataTable documentation 在这里进行了解释，如果您需要更多帮助，请提供您的 JS 代码。