jQuery EasyUI 数据网格 - 自定义分页

下面直接给你最实用、最常见的几种自定义分页栏方法（jQuery EasyUI datagrid），复制粘贴就能用，领导最喜欢的那种专业效果全都有！

方法1：最简单 - 在分页栏右边添加自定义按钮（推荐入门用这个）
比如加“导出Excel”、“刷新全部”、“跳转到某页”按钮。

<tableid="dg"class="easyui-datagrid"title="用户列表"url="your_data.json"pagination="true"fitColumns="true"singleSelect="false"rownumbers="true"><thead><tr><thfield="ck"checkbox="true"></th><thfield="id"width="80">ID</th><thfield="name"width="100">姓名</th><thfield="age"width="60">年龄</th></tr></thead></table><script>$(function(){varpager=$('#dg').datagrid('getPager');// 获取分页栏对象pager.pagination({pageSize:20,// 默认每页条数pageList:[10,20,50,100],// 可选每页条数showPageList:true,// 显示下拉选择每页条数showRefresh:true,// 显示刷新按钮displayMsg:'当前显示 {from} - {to} 条，共 {total} 条记录',// 自定义提示文字layout:['list','sep','first','prev','sep','manual','sep','next','last','sep','refresh'],// 自定义布局顺序buttons:[{// 右边添加自定义按钮iconCls:'icon-excel',text:'导出Excel',handler:function(){alert('导出所有数据到Excel');// 这里写你的导出逻辑}},{iconCls:'icon-reload',text:'刷新全部',handler:function(){$('#dg').datagrid('reload');}}],onBeforeRefresh:function(){// 刷新前可以加提示returnconfirm('确定刷新数据吗？');}});});</script>

效果：分页栏右边会出现“导出Excel”和“刷新全部”两个按钮，超级专业！

方法2：隐藏默认的部分元素，只保留你想要的（比如不要每页条数下拉）

varpager=$('#dg').datagrid('getPager');pager.pagination({showPageList:false,// 隐藏每页条数下拉框showRefresh:false,// 隐藏刷新按钮layout:['first','prev','links','next','last'],// 只显示首尾页、上下页、页码链接buttons:[{iconCls:'icon-print',text:'打印',handler:function(){alert('打印当前页');}}]});

方法3：完全自定义分页栏（高级用法，比如加输入框跳转页码）

varpager=$('#dg').datagrid('getPager');$(pager).pagination({layout:['sep'],// 先清空默认布局beforePageText:'跳转到',afterPageText:'页',displayMsg:'',buttons:[{text:'跳转',handler:function(){varpage=$(pager).find('input.pagination-num').val();$('#dg').datagrid('options').pageNumber=parseInt(page);$('#dg').datagrid('reload');}}]});

方法4：分页栏放在顶部（默认在底部）
在datagrid选项里加：

$('#dg').datagrid({pagination:true,pagePosition:'top'// 或 'both' 上下都有});

你现在直接用方法1，复制到你的页面，刷新一下就能看到自定义的分页栏出来了！
很多项目里领导要求“分页栏要加导出按钮、显示总条数更清晰”，上面代码全满足。

想要我给你一个完整的HTML示例（带远程加载数据 + 复选框 + 自定义分页 + 批量删除）？
或者你告诉我你想在分页栏加什么按钮/功能（比如“导出选中行”、“统计合计”），我2分钟给你写好代码，复制就能跑！

快说说你现在的需求，我手把手帮你搞定，5分钟内看到完美分页效果！