如何使用 Jquery 扩展表格单元格？

【问题标题】：How to expand a Table Cell with Jquery?如何使用 Jquery 扩展表格单元格？
【发布时间】：2013-11-02 23:31:00
【问题描述】：

我想要一个表格/列表，其中包含某个事件，每行都有日期和标题，一旦您单击该行，它就会展开以显示该事件的照片文档。

我知道使用 div 会很容易，但我需要日期/标题/等的表格布局。有没有办法对表格做同样的事情，但出现的内容包括所有表格单元格（照片出现在下面，好像所有 td 已经重新组合成一个）？

【问题讨论】：

标签： jquery html-table expand

【解决方案1】：

不太确定您到底要做什么，但是您可以在每个事件 tr 下使用带有 display:none 的额外 tr。然后在点击时用 jQuery 切换它。

【讨论】：

【解决方案2】：

我不确定，但你有类似的东西

 <table>
   <tr><td>Data</td><td style="display: none;"><img src=""/></td></tr>
   <tr><td>Data</td><td style="display: none;"><img src=""/></td></tr>
   <tr><td>Data</td><td style="display: none;"><img src=""/></td></tr>
   ...
 </table>

当用户点击行时，最后一行更改显示在例如块？

如果是真的，你可以：

 $('tr').click(function() {
    $(this).find('td:last').toggle();
 });

【讨论】：