我需要向我的用户显示数据库中的信息记录。目前,我已将此信息绑定(bind)到数据网格。但是,要显示的字段太多,我的表格超出了页面范围。我真的不希望我的页面具有水平滚动,并且我不想减小字体大小..所以我想知道是否有人有更好的想法来显示长行数据?只需询问是否需要任何其他信息,谢谢:)
最佳答案
对于此类问题,我的首选解决方案是收集最重要的信息(任何可以立即识别该行的内容/人物的信息),并将其余信息放在新的 TD 和内部表中的下一行中。使用 JavaScript 隐藏/显示它,你就很出色了。
HTML 示例
<tr>
<td>Joe</td>
<td>Jones</td>
<td>555-555-5555 (m)</td>
<td class="more">more..</td>
</tr>
<tr class='showme'>
<td class='showthis' colspan="4">
<h2>More info</h2>
<table>
<!-- yet more info here -->
</table>
</td>
</tr>
使用 jQuery 使其正常工作
$("td.more").click(function(){
// don't hide/show the next TR itself, may cause cross-browser issues
$(this).closest("tr").next("tr.showme").find(".showthis").slideToggle();
});
必要的CSS
.showthis { display:none; }
/* you'll want to play with padding and such for open/close states, too */
当然,您可以使其变得更加复杂,但这是基本功能。
关于user-interface - 显示长行数据的好方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5047549/