Data Tables 是一款jquery的表格插件 功能很强大 具体说明可见官网
官网地址:https://datatables.net
下载地址:https://datatables.net/download/index
使用:
引入js和css的min文件 和images文件夹中图标(过大 可自行压缩)
页面为table添加唯一标识
表格数据加载完成后 做初始化配置
注意: 如果对表格做了局部刷新 请在刷新完成后重新做datatable初始化。
重新初始化时 先执行
dttable.fnDestroy(); //还原初始datatable
$('#cccc').DataTable({
"searching" : false,//去掉搜索框 (下面有自定义方法)
"bAutoWidth":false,//是否自动计算列宽
"paging": false, //禁止分页
"bInfo" : false,//隐藏下方提示信息
"aoColumnDefs": [ { "bSortable": false, "aTargets": [ 5 ] }],//初始化datatable,但对序号为5列的列不进行排序,别的列均可进行排序
columnDefs: [ {
targets: [ 0 ],
orderData: [ 0, 1 ]
}, {
targets: [ 1 ],
orderData: [ 1, 0 ]
}, {
targets: [ 4 ],
orderData: [ 4, 0 ]
}]
});
如果不用自带的搜索框 可自定义
自定义搜索过滤方法:
function search_fun(){
var val = $('#search_val').val();//获取我们自己定义的input值
dataTable._fnFilter(val);//过滤dataTable
}
下面是效果图
以上是简单使,还有很多其他功能,尚未去看 ,仅作自己记录。谢谢!
是一款jquery表格插件
是一是一款jquery表格插件款jquery表格是一款jquery表格插件插件