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 相关文章推荐
extjs DataReader、JsonReader、XmlReader的构造方法
Nov 07 Javascript
jquery的键盘事件修改代码
Feb 24 Javascript
解析jQuery与其它js(Prototype)库兼容共存
Jul 04 Javascript
js给网页加上背景音乐及选择音效的方法
Mar 03 Javascript
JavaScript中isPrototypeOf函数作用和使用实例
Jun 01 Javascript
JavaScript中使用Math.PI圆周率属性的方法
Jun 14 Javascript
Bootstrap select下拉联动(jQuery cxselect)
Jan 04 Javascript
BootStrap实现鼠标悬停下拉列表功能
Feb 17 Javascript
激动人心的 Angular HttpClient的源码解析
Jul 10 Javascript
angular2中使用第三方js库的实例
Feb 26 Javascript
vue中使用gojs/jointjs的示例代码
Aug 24 Javascript
在Koa.js中实现文件上传的接口功能
Oct 08 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
php include的妙用,实现路径加密
2008/07/29 PHP
php 模拟 asp.net webFrom 按钮提交事件实例
2014/10/13 PHP
php判断文件上传类型及过滤不安全数据的方法
2014/12/17 PHP
PHP dirname(__FILE__)原理及用法解析
2020/10/28 PHP
Git命令之分支详解
2021/03/02 PHP
JavaScript设计模式之观察者模式(发布者-订阅者模式)
2014/09/24 Javascript
JavaScript阻止事件冒泡示例分享
2014/12/28 Javascript
JavaScript获取当前运行脚本文件所在目录的方法
2016/02/03 Javascript
xtemplate node.js 的使用方法实例解析
2016/08/22 Javascript
JavaScript中的toString()和toLocaleString()方法的区别
2017/02/15 Javascript
详解vue-resource promise兼容性问题
2017/06/20 Javascript
详谈ES6中的迭代器(Iterator)和生成器(Generator)
2017/07/31 Javascript
JS实现常见的查找、排序、去重算法示例
2018/05/21 Javascript
微信小程序实现文件、图片上传功能
2020/08/18 Javascript
微信小程序嵌入腾讯视频源过程详解
2019/08/08 Javascript
微信小程序静默登录的实现代码
2020/01/08 Javascript
jQuery 选择器用法实例分析【prev + next】
2020/05/22 jQuery
微信小程序实现倒计时功能
2020/11/19 Javascript
[05:45]Ti4观战指南(下)
2014/07/07 DOTA
[46:20]TFT vs Secret Supermajor小组赛C组 BO3 第二场 6.3
2018/06/04 DOTA
python 简单照相机调用系统摄像头实现方法 pygame
2018/08/03 Python
Python使用turtle库绘制小猪佩奇(实例代码)
2020/01/16 Python
pytorch实现保证每次运行使用的随机数都相同
2020/02/20 Python
基于Python生成个性二维码过程详解
2020/03/05 Python
TensorFlow实现模型断点训练,checkpoint模型载入方式
2020/05/26 Python
用css3写出气球样式的示例代码
2017/09/11 HTML / CSS
《可爱的动物》教学反思
2014/02/22 职场文书
爱之链教学反思
2014/04/30 职场文书
个人先进材料范文
2014/12/30 职场文书
农业项目合作意向书
2015/05/08 职场文书
圣诞晚会主持词
2015/07/01 职场文书
反邪教学习心得体会
2016/01/15 职场文书
浅谈Python协程asyncio
2021/06/20 Python
Redis三种集群模式详解
2021/10/05 Redis
Python读写yaml文件
2022/03/20 Python
SpringBoot集成MongoDB实现文件上传的步骤
2022/04/18 MongoDB