搜索
博主信息
博文 39
粉丝 1
评论 0
访问量 72334
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
JS——jquery.dataTables.js
Dai的博客
原创
1340人浏览过

基础设置:

"bPaginate": true, //翻页功能  
"bLengthChange": true, //改变每页显示数据数量  
"bFilter": true, //过滤功能  
"bSort": false, //排序功能  
"bInfo": true,//页脚信息  
"bAutoWidth": true//自动宽度

实例:

$('.table-sort').dataTable({
	"aaSorting": [[ 1, "desc" ]],//默认第几个排序
	"bStateSave": true,//状态保存
	"aoColumnDefs": [
	  //{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
	  {"orderable":false,"aTargets":[0,6]}// 制定列不参与排序
	],
  "aLengthMenu": [[5, 10, 25, -1], [5, 10, 25, "All"]]//控制显示几列数据
});

1、排序控制

{ "asSorting": [ "desc", "asc", "asc" ] }

2、控制显示一页显示几页数据

  "aLengthMenu": [[5, 10, 25, -1], [5, 10, 25, "All"]]//控制显示几列数据

3、文字显示

$('.table-sort').dataTable( {  
"oLanguage": {  
"sLengthMenu": "每页显示 _MENU_ 条记录",  
"sZeroRecords": "抱歉, 没有找到",  
"sInfo": "从 _START_ 到 _END_ /共 _TOTAL_ 条数据",  
"sInfoEmpty": "没有数据",  
"sInfoFiltered": "(从 _MAX_ 条数据中检索)",  
"oPaginate": {  
"sFirst": "首页",  
"sPrevious": "前一页",  
"sNext": "后一页",  
"sLast": "尾页"  
},  
"sZeroRecords": "没有检索到数据",  
"sProcessing": "<img src='./loading.gif' />"  
}  
} );

4、状态保存,使用了翻页或者改变了每页显示数据数量,会保存在cookie中,下回访问时会显示上一次关闭页面时的内容

"bStateSave": true

5、翻页样式

"sPaginationType": "full_numbers"

属性表:

QQ截图20170807205942.png

QQ截图20170807210005.png

在线手册:传送门:https://www.datatables.club/manual/#data

本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学