如何使 jsp 表可滚动？答案

【问题标题】：How can I make a jsp table scrollable?如何使 jsp 表可滚动？
【发布时间】：2017-09-17 19:09:20
【问题描述】：

我在 JSP 页面上有下表。表上的行数是可变的，由控制器传递的列表填充。如何添加滚动以固定表头？我知道在 JSF 上这很容易，但是如何在 JSP 上做到呢？

<body>

    <table>
        <thead>
            <tr>
                <th>PO</th>
                <th>Product</th>
                <th>Batch Size</th>
                <th>SPI</th>
                <th>AOI</th>
                <th>PTH</th>
                <th>Inspection</th>
                <th>Tests</th>
                <th>Expedition</th>
            </tr>
        </thead>
        <tbody id="prodReportTable">
            <c:forEach var="pojo" items="${list}">
                <tr>
                    <td>${pojo.po}</td>
                    <td>${pojo.productName}</td>
                    <td>${pojo.poSize}</td>
                    <td>${pojo.spi}</td>
                    <td>${pojo.aoi}</td>
                    <td>${pojo.pth}</td>
                    <td>${pojo.inspection}</td>
                    <td>${pojo.tests}</td>
                    <td>${pojo.expedition}</td>
                </tr>
            </c:forEach>
        </tbody>
    </table>

</body>

【问题讨论】：

标签： html jsp scroll html-table

【解决方案1】：

如果您不关心跨浏览器兼容性，您可以在 TBODY 上使用此样式：

#prodReportTable
{
    overflow-y:scroll; 
    height:200px;  
    position:absolute;
}

此外，您可以通过以下方式摆脱 IE 中糟糕的行间距：（不幸的是，没有滚动条）

#prodReportTable TR
{
    height:1em;
}

【讨论】：

【解决方案2】：

你查看JQuery Tablesorter了吗？

【讨论】：

感谢您的提示，但这是用于表格排序而不是表格滚动，对吧？
对不起，如果是这样，您可能想检查 jquery 可滚动表插件 :) farinspace.com/jquery-scrollable-table-plugin

【解决方案3】：

看看jqgrid（http://www.trirand.com/blog/），它是一个jquery表格网格插件。我已经成功使用它，它节省了大量时间。它具有排序、过滤、格式化、分页和其他选项。

如果您想要一个“技术含量较低”的解决方案，只需制作一个标题 div 和一个可 x 滚动的正文 div。如果这没有意义，请告诉我，我可以发送样品...

祝你好运！

【讨论】：