一、新建一js文件jquery_fixedtablehead.js
内容如下：
复制代码 代码如下:
jquery.fn.clonetableheader = function(tableid, tableparentdivid) {    var obj = document.getelementbyid(tableheaderdiv + tableid);
    if (obj) {
        jquery(obj).remove();
    }
    var browsername = navigator.appname;
    var ver = navigator.appversion;
    var browserversion = parsefloat(ver.substring(ver.indexof(msie) + 5, ver.lastindexof(windows)));
    var content = document.getelementbyid(tableparentdivid);
    var scrollwidth = content.offsetwidth - content.clientwidth;
    var tableorg = jquery(# + tableid)
    var table = tableorg.clone();
    table.attr(id, clonetable);
    var tableclone = jquery(tableorg).find(tr).each(function() {
    });
    var tableheader = jquery(tableorg).find(thead);
    var tableheaderheight = tableheader.height();
    tableheader.hide();
    var colswidths = jquery(tableorg).find(tbody tr:first td).map(function() {
        return jquery(this).width();
    });
    var tableclonecols = jquery(table).find(thead tr:first td)
    if (colswidths.size() > 0) {
        for (i = 0; i
            if (i == tableclonecols.size() - 1) {
                if (browserversion == 8.0)
                    tableclonecols.eq(i).width(colswidths[i] + scrollwidth);
                else
                    tableclonecols.eq(i).width(colswidths[i]);
            } else {
                tableclonecols.eq(i).width(colswidths[i]);
            }
        }
    }
    var headerdiv = document.createelement(div);
    headerdiv.appendchild(table[0]);
    jquery(headerdiv).css(height, tableheaderheight);
    jquery(headerdiv).css(overflow, hidden);
    jquery(headerdiv).css(z-index, 20);
    jquery(headerdiv).css(width, 100%);
    jquery(headerdiv).attr(id, tableheaderdiv + tableid);
    jquery(headerdiv).insertbefore(tableorg.parent());
}
二、html实例文件
内容如下：
复制代码 代码如下:
qubernet@163.com_jquery实现表头固定效果（挺不错的！！！）
.itemlist
        {
            border: solid 1px #cccccc;
            overflow: hidden;
            width: 100%;
            border-collapse: collapse;
        }
        .itemlist td
        {
            padding: 0px 0px 0px 0px;
            color: #444444;
            border: solid 1px #cccccc;
            text-align: center;
            line-height: 20px;
        }
jquery(function() {
            jquery.fn.clonetableheader(tab1, div1);
        });
列1
列2
列3
列4
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行………… 我是测试的数据行…………
注意：记得引入jquery类库文件。