jquery.dataTable.js 基础配置

最新推荐文章于 2025-04-03 12:11:09 发布

转载最新推荐文章于 2025-04-03 12:11:09 发布 · 110 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/hofmann/p/5169503.html

文章标签：

#javascript #ViewUI

本文详细介绍了如何利用Datatable插件为网页应用创建动态响应式数据表格，包括翻页、筛选、排序等功能，并通过实例演示如何实现数据表格的自适应布局，确保在不同设备上都能提供良好的用户体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

$(document).ready(function () {
$('#dataTables-example').DataTable({
responsive: true,
"bPaginate": true, //翻页功能
"bLengthChange": true, //改变每页显示数据数量
"bFilter": true, //过滤功能
"bSort": true, //排序功能
"bInfo": true,//页脚信息
"bAutoWidth": true,//自动宽度
"bStateSave": true,//状态保存，使用了翻页或者改变了每页显示数据数量，会保存在cookie中，下回访问时会显示上一次关闭页面时的内容。

"sLengthMenu": "每页显示 _MENU_ 条记录",
"sZeroRecords": "抱歉，没有找到",
"sInfo": "从 _START_ 到 _END_ /共 _TOTAL_ 条数据",
"sInfoEmpty": "没有数据",
"sInfoFiltered": "(从 _MAX_ 条数据中检索)",
"sZeroRecords": "没有检索到数据",
"sSearch": "名称:",
"oPaginate": {
"sFirst": "首页",
"sPrevious": "前一页",
"sNext": "后一页",
"sLast": "尾页"
},
"sPaginationType": "full_numbers",

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

});
});

转载于:https://www.cnblogs.com/hofmann/p/5169503.html