冻结JSP表头和列

Question

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

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

请为我提供最好的解决方案。

Answer 1

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;
}