jsp页面table表头固定-freezeheader

最新推荐文章于 2025-06-02 10:46:50 发布

noMoreBugs

最新推荐文章于 2025-06-02 10:46:50 发布

阅读量1.9k

点赞数

CC 4.0 BY-SA版权

文章标签： jsp table表头固定

本文链接：https://blog.youkuaiyun.com/noMoreBugs/article/details/89203937

本文介绍了一种在网页中实现表格表头固定的插件使用方法。通过导入jQuery与freezeheader包，结合Ajax请求动态加载数据，实现了在Firefox、Chrome、Safari及IE10以上浏览器的兼容性。文章详细描述了从初始化到渲染完成后的固定表头实现过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

该插件兼容firefox，charome，safari，ie10以上的版本。

1.导入jquery与freezeheader的包；
jquery引入 freezeheader引入
2.页面中的table；
table
3.通过ajax请求后台返回数据拼接table；

具体拼接过程省略。。。

4.在第3步table表与拼接完成，页面完成渲染后，实现table表头固定；
在 ajax
success: function(data){
//先拼接table，在table.append()完成后，
//在末尾加入固定表头代码
}

//固定表头，有固定的表头和滚动条
var vHei=$(window).height();
var v4 = (vHei-250)+“px”;
$("#tableDemo1").freezeHeader({ ‘height’: v4 });
$("#tableDemo2").freezeHeader({ ‘height’: v4 });

5.完成。

后记：
上述因为是ajax返回拼接table处理方式，如果是跳转页面用c标签填充table的话，直接用
(window).height();var v4 = (vHei-250)+"px";$("#tableDemo1").freezeHeader({ 'height': v4 });$("#tableDemo2").freezeHeader({ 'height': v4 });})参考： http://www.jq22.com/jquery-info5769 在这里插入图片描述