冻结JSP表头和列

时间:2014-03-12 04:46:29

标签: jquery jsp html-table

我想在jsp页面上获得类似于http://www.massless.org/_tests/grid1/的表格布局。表头和第一个4/5列的第一行是固定的。 我在My Jsp中使用了以下结构:

<div id="tableData">
    <table id="data">
        <thead>
        .
        .
        .
        </thead>
        <tbody>
        .
        .
        .
        </tbody>
    </table>
</div>

请为我提供最佳解决方案。

1 个答案:

答案 0 :(得分:0)

html:
-----
<table>
    <thead>
        <tr>
            <td>col1</td>
            <td>col2</td>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>

javascript:
------------
$(function() {
    for (var i = 0; i < 20; i++) {
        var a = Math.floor(10 * Math.random());
        var b = Math.floor(10 * Math.random());
        var row = $("<tr>").append($("<td>").html(a + " + " + b + " ="))
                           .append($("<td>").html(a + b));
        $("tbody").append(row);
    }
});

css:
---

tbody {
    background-color: #ddd;
    height: 100px;
    overflow: auto;
}
td {
    padding: 3px 10px;
}