使用jquerydataTable.docVIP

使用jquery dataTable jQuery 的插件 dataTables 是一个优秀的表格插件，提供了针对表格的排序、浏览器分页、服务器分页、筛选、格式化等功能。dataTables 的网站上也提供了大量的演示和详细的文档进行说明，为了方便学习使用，这里一步一步进行说明。 首先，需要到 dataTables 的网站 / 下载这个脚本库， 目前最新的版本是 1.8.2，下载的压缩包中使用的 jQuery 是 1.4.4 。现在 jQuery1.5.1 已经发布，所以，这里使用最新的 jQuery 1.5.1 。 然后，在网页中先加入 jQuery 的引用，然后，加入 dataTables 的引用。 引入CSS文件和JS文件 style type=text/css title=currentStyle @import DataTables-1.8.1/media/css/demo_page.css; @import DataTables-1.8.1/media/css/demo_table.css; @import DataTables-1.8.1/media/css/demo_table_jui.css;/stylescript type=text/javascript language=javascript src=DataTables-1.8.1/media/js/jquery.js/scriptscript type=text/javascript language=javascript src=DataTables-1.8.1/media/js/jquery.dataTables.js/script 最简单的方式： $(document).ready(function() { $(#example).dataTable(); }); 也可以自己定义各属性： script type=text/javascript language=javascript $(document).ready(function() { $(#example).dataTable({// bPaginate: true, //开关，是否显示分页器// bInfo: true, //开关，是否显示表格的一些信息// bFilter: true, //开关，是否启用客户端过滤器// sDom: lfrtip,// bAutoWith: false,// bDeferRender: false,// bJQueryUI: false, //开关，是否启用JQueryUI风格// bLengthChange: true, //开关，是否显示每页大小的下拉框// bProcessing: true,// bScrollInfinite: false,// sScrollY: 800px, //是否开启垂直滚动，以及指定滚动区域大小,可设值：disabled,2000px// bSort: true, //开关，是否启用各列具有按列排序的功能// bSortClasses: true,// bStateSave: false, //开关，是否打开客户端状态记录功能。这个数据是记录在cookies中的，打开了这个记录后，即使刷新一次页面，或重新打开浏览器，之前的状态都是保存下来的- 当值为true时aoColumnDefs不能隐藏列// sScrollX: 50%, //是否开启水平滚动，以及指定滚动区域大小,可设值：disabled,2000%// aaSorting: [[0, asc]], // aoColumnDefs: [{ bVisible: false, aTargets: [0]}]//隐藏列// sDom: HiftFif, bAutoWidth: false, //自适应宽度 aaSorti