您当前的位置:首页 > 网站建设 > jQuery
| php | asp | css | H5 | javascript | Mysql | Dreamweaver | Delphi | 网站维护 | 帝国cms | React | 考试系统 | ajax | jQuery |

jQuery EasyUI 基础插件 - Pagination 分页

51自学网 2023-01-16 20:14:28
  jQuery

通过 $.fn.pagination.defaults 重写默认的 defaults。

分页(pagination)允许用户通过翻页导航数据。它支持页面导航和页面长度选择的可配置选项。用户可以在分页的右侧添加自定义按钮来增强功能。

依赖

  • linkbutton

用法

通过标记创建分页(pagination)。

<div id="pp" class="easyui-pagination" style="background:#efefef;border:1px solid #ccc;"    data-options="total:2000,pageSize:10"></div>

使用 javascript 创建分页(pagination)。

<div id="pp" style="background:#efefef;border:1px solid #ccc;"></div>
$('#pp').pagination({    total:2000,    pageSize:10});

让我们通过面板(panel)和分页(pagination)插件创建 ajax 分页(pagination)。当用户选择一个新的页面时,面板(panel)将显示指定页面的相应内容。

<div id="content" class="easyui-panel" style="height:200px"    data-options="href:'show_content.php?page=1'"></div><div class="easyui-pagination" style="border:1px solid #ccc;"    data-options="    total: 2000,    pageSize: 10,    onSelectPage: function(pageNumber, pageSize){    $('#content').panel('refresh', 'show_content.php?page='+pageNumber);    }"></div>

顶部的面板(panel)默认显示第一个页面的内容。当用户导航页面时,'onSelectPage' 事件将被触发,该事件为内容面板(panel)调用 'refresh' 方法来加载带有一个新的 URL 参数的新页面内容。

属性

名称 类型 描述默认值
total number 记录总数,应该在创建分页(pagination)时设置。1
pageSize number 页面尺寸。(注:每页显示的最大记录数)10
pageNumber number 创建分页(pagination)时显示的页码。1
pageList array 用户能改变页面尺寸。pageList 属性定义了能改成多大的尺寸。
代码实例:
$('#pp').pagination({
下载地址:
jQuery EasyUI 基础插件 - Searchbox 搜索框
jQuery EasyUI 基础插件 - Resizable 可调整尺寸
51自学网,即我要自学网,自学EXCEL、自学PS、自学CAD、自学C语言、自学css3实例,是一个通过网络自主学习工作技能的自学平台,网友喜欢的软件自学网站。
京ICP备13026421号-1