1.引用jquery.datatables.js
2.在页面配置datatable
下面是没有在服务器端启用分页，获取所有数据，客户端自动分页
$(".data-table").dataTable({
"bDestory": true,//清除数据源
"bRetrieve": true,
"bPaginate": true, //开关，是否显示分页器
// "bInfo": true, //开关，是否显示表格的一些信息
"bFilter": false, //开关，是否启用客户端过滤器
// "bAutoWith": false,
// "bDeferRender": false,
"bJQueryUI": true, //开关，是否启用JQueryUI风格
"bLengthChange": false, //开关，是否显示每页大小的下拉框
//"bProcessing": true,
"bServerSide": false,//是否启用服务器端分页
// "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]}]//隐藏列
"sAjaxSource": "../Tools/getTable.ashx?time=" + time + "&&shoplist=" + shoplist,
//sEcho=3&iDisplayStart=1&iDisplayLength=2&iSortingCols=1&sSearch=false&iColumns=4&sColumns=sysType,userCode,sysMsg,sysIP,sysTime",
"sDom": '<""l>t<"F"fp>',
"bAutoWidth": false, //自适应宽度
"aaSorting": [[1, "asc"]],
"sPaginationType": "full_numbers",
"oLanguage": {
"iDisplayLength": 2,
"sProcessing": "正在加载中......",
"sLengthMenu": "每页显示 _MENU_ 条记录",
"sZeroRecords": "对不起，查询不到相关数据！",
"sEmptyTable": "表中无数据存在！",
"sInfo": "当前显示 _START_ 到 _END_ 条，共 _TOTAL_ 条记录",
"sInfoFiltered": "数据表中共为 _MAX_ 条记录",
"sSearch": "搜索",
"oPaginate": {
"sFirst": "首页",
"sPrevious": "上一页",
"sNext": "下一页",
"sLast": "末页"
}
} //多语言配置
}).fnDestroy();
"bDestory": true,//清除数据源 "bRetrieve": true,
fnDestroy()
以上三个配置后，才能动态查询
在服务器端启用分页，将 "bServerSide"设置为true，会传递参数到服务器端