jquery插件固定table表头_jq固定表格头部资源-CSDN文库

共4个文件

js：2个

gif：1个

html：1个

table固定头

js固定表头

jquery插件

需积分: 50 61 浏览量 2018-09-25 20:01:22 上传评论收藏 462KB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

jquery.table.fixed.zip （4个子文件）

table.fixed

效果.gif 507KB

jquery-1.10.1.min.js 91KB

jquery.tablefixed.js 4KB

test.html 2KB

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>测试</title> <script type="text/javascript" src="jquery-1.10.1.min.js"></script> <script> //创建测试用的表格数据 $(function () { var str = ' <tr><td style="display:none;">1acc508a-c064-11e8-9d01-fa163e12636c</td><td>毛毛</td><td class="price"> 0.0 </td><td><label>测试</label> </td> <td> 2018-09-30</td></tr>' for (var i = 0; i < 100; i++) { document.getElementById("bodyTr").innerHTML += str; } }) </script> <style> /** * 自定义表格样式 **/ table { border-collapse: collapse; border-spacing: 2px; border-radius: 3px; width: 100%; margin-bottom: 8px; } tr { display: table-row; vertical-align: inherit; border-color: inherit; } th { height: 50px; background: #f5f5f5; border: none; line-height: 50px; color: #333; font-size: 14px; } td { height: 50px; line-height: 50px; border-bottom: 1px solid #ccc; } tbody { display: table-row-group; vertical-align: middle; border-color: inherit; text-align: center; } </style> </head> <body> <table> <thead> <tr> <th>姓名</th> <th>金额</th> <th>类别</th> <th>日期</th> </tr> </thead> <tbody id="bodyTr"> </tbody> </table> </body>  <script type="text/javascript" src="jquery.tablefixed.js"></script> <script> setTimeout(function(){ /** * 调用方法 */ $("table").fixedTable({divHeadId:'divHead_top',divBodyId:'divBody_top',height:"300px",width:"50%"}); },20); </script> </html>

评论收藏

内容反馈