jQuery Pagination分页插件使用方法详解


Posted in Javascript onFebruary 28, 2017

本文实例为大家分享了jQuery Pagination分页插件的具体代码,供大家参考,具体内容如下

一、引用CSS和JS:

<link href="/Content/Plugins/jQuery.Pagination_v2.2/pagination.css" rel="external nofollow" rel="stylesheet"
 type="text/css" />
<script src="/Content/Plugins/jQuery.Pagination_v2.2/jquery.pagination.js" type="text/javascript"></script>

二、HTML:

<div id="Pagination" class="flickr" style="margin-top: 10px; margin-left: 10px;">
</div>

三、JS:

$(function () {
 var total = parseInt("@(ViewBag.total)");
 var page = parseInt("@(ViewBag.page)") - 1;
 var pageSize = parseInt("@(ViewBag.pageSize)");

 $("#Pagination").pagination(total, {
 callback: function (page_id) {
  window.location = "BoardList?page=" + page_id + "&pageSize=" + this.items_per_page;
 }, //PageCallback() 为翻页调用次函数。
 prev_text: " 上一页",
 next_text: "下一页 ",
 items_per_page: 10, //每页的数据个数
 num_display_entries: 1, //两侧首尾分页条目数
 current_page: page, //当前页码
 num_edge_entries: 11 //连续分页主体部分分页条目数
 });
});

四、后台代码:

public ActionResult BoardList()
{
 PagerModel pager = new PagerModel();
 if (Request["page"] == null)
 {
 pager.page = 1;
 pager.rows = 10;
 pager.sort = "Id";
 pager.order = "desc";
 }
 else
 {
 pager.page = int.Parse(Request["page"]) + 1;
 pager.rows = int.Parse(Request["pageSize"]);
 pager.sort = "Id";
 pager.order = "desc";
 }

 boardManageService.GetList(ref pager);
 List<BoardModel> boardList = pager.result as List<BoardModel>;
 ViewData["BoardModelList"] = boardList;
 ViewBag.page = pager.page;
 ViewBag.total = pager.totalRows;
 ViewBag.pageSize = pager.rows;

 return View();
}
#endregion

更多精彩内容请点击:jquery分页功能汇总进行学习。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
json格式化/压缩工具 Chrome插件扩展版
May 25 Javascript
jquery.messager.js插件导致页面抖动的解决方法
Jul 14 Javascript
教你如何自定义百度分享插件以及bshare分享插件的分享按钮
Jun 20 Javascript
基于jQuery实现拖拽图标到回收站并删除功能
Nov 25 Javascript
原生js三级联动的简单实现代码
Jun 07 Javascript
js中动态创建json,动态为json添加属性、属性值的实例
Dec 02 Javascript
整理关于Bootstrap导航的慕课笔记
Mar 29 Javascript
bootstrap table单元格新增行并编辑
May 19 Javascript
axios全局注册,设置token,以及全局设置url请求网段的方法
Sep 25 Javascript
JavaScript实现学生在线做题计时器功能
Dec 05 Javascript
Node.js使用supervisor进行开发中调试的方法
Mar 26 Javascript
基于Vue的商品主图放大镜方案详解
Sep 19 Javascript
完美解决input[type=number]无法显示非数字字符的问题
Feb 28 #Javascript
canvas红包照片实例分享
Feb 28 #Javascript
详解本地Node.js服务器作为api服务器的解决办法
Feb 28 #Javascript
jquery操作select取值赋值与设置选中实例
Feb 28 #Javascript
JS使用面向对象技术实现的tab选项卡效果示例
Feb 28 #Javascript
基于cookie实现zTree树刷新后展开状态不变
Feb 28 #Javascript
js中Number数字数值运算后值不对的解决方法
Feb 28 #Javascript
You might like
深入PHP5中的魔术方法详解
2013/06/17 PHP
腾讯CMEM的PHP扩展编译安装方法
2015/09/25 PHP
ThinkPHP表单令牌错误的相关解决方法分析
2016/05/20 PHP
万能的php分页类
2017/07/06 PHP
PHP实现简单的模板引擎功能示例
2017/09/02 PHP
jquery中实现标签切换效果的代码
2011/03/01 Javascript
jquery 自定义容器下雨效果可将下雨图标改为其他
2014/04/23 Javascript
JavaScript中伪协议 javascript:使用探讨
2014/07/18 Javascript
Egret引擎开发指南之视觉编程
2014/09/03 Javascript
jQuery中append()方法用法实例
2014/12/25 Javascript
JQuery异步获取返回值中文乱码的解决方法
2015/01/29 Javascript
easyui datagrid 大数据加载效率慢,优化解决方法(推荐)
2016/11/09 Javascript
JavaScript+Html5实现按钮复制文字到剪切板功能(手机网页兼容)
2017/03/30 Javascript
老生常谈ES6中的类
2017/07/31 Javascript
详解vue移动端项目的适配(以mint-ui为例)
2018/08/17 Javascript
vue 之 css module的使用方法
2018/12/04 Javascript
详解几十行代码实现一个vue的状态管理
2019/01/28 Javascript
js实现贪吃蛇小游戏
2019/10/29 Javascript
NodeJS http模块用法示例【创建web服务器/客户端】
2019/11/05 NodeJs
python实现linux服务器批量修改密码并生成execl
2014/04/22 Python
python文件读写操作与linux shell变量命令交互执行的方法
2015/01/14 Python
基于Python代码编辑器的选用(详解)
2017/09/13 Python
使用HTML5技术开发一个属于自己的超酷颜色选择器
2013/09/22 HTML / CSS
欧洲、亚洲、非洲和拉丁美洲的度假套餐:Great Value Vacations
2019/03/30 全球购物
美国第一大药店连锁机构:Walgreens(沃尔格林)
2019/10/10 全球购物
聚网科技C++面试笔试题
2015/09/01 面试题
自荐信格式
2013/12/01 职场文书
反邪教警示教育方案
2014/05/13 职场文书
自动化专业毕业生求职信
2014/06/18 职场文书
2015年行政执法工作总结
2015/05/23 职场文书
2016年基层党组织创先争优承诺书
2016/03/25 职场文书
研究生学习计划书应该怎么写?
2019/09/10 职场文书
pytorch查看网络参数显存占用量等操作
2021/05/12 Python
Python requests用法和django后台处理详解
2022/03/19 Python
索尼ICF-36收音机评测
2022/04/30 无线电
深入理解pytorch库的dockerfile
2022/06/10 Python