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 相关文章推荐
JS俄罗斯方块,包含完整的设计理念
Dec 11 Javascript
那些年,我还在学习jquery 学习笔记
Mar 05 Javascript
javascript列表框操作函数集合汇总
Nov 28 Javascript
js,jquery滚动/跳转页面到指定位置的实现思路
Jun 03 Javascript
jQuery中多个元素的Hover事件解决方案
Jun 12 Javascript
jQuery实现Meizu魅族官方网站的导航菜单效果
Sep 14 Javascript
微信小程序WebSocket实现聊天对话功能
Jul 06 Javascript
微信小程序之裁剪图片成圆形的实现代码
Oct 11 Javascript
基于Vue插入视频的2种方法小结
Apr 02 Javascript
小程序云开发实现数据库异步操作同步化
May 18 Javascript
解决vant title-active-color与title-inactive-color不生效问题
Nov 03 Javascript
分享15个Webpack实用的插件!!!
Mar 31 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全排列递归算法代码
2012/10/09 PHP
深入PHP autoload机制的详解
2013/06/09 PHP
PHPstorm快捷键(分享)
2017/07/17 PHP
PHP实现的折半查找算法示例
2017/12/19 PHP
php压缩文件夹最新版
2018/07/18 PHP
js 鼠标点击事件及其它捕获
2009/06/04 Javascript
禁止JQuery中的load方法装载IE缓存中文件的方法
2009/09/11 Javascript
jquery下利用jsonp跨域访问实现方法
2010/07/29 Javascript
jQuery 表单验证扩展代码(二)
2010/10/20 Javascript
验证码按回车不变解决方法
2013/03/29 Javascript
js中onload与onunload的使用示例
2013/08/25 Javascript
Jquery中给animation加更多的运作效果实例
2013/09/05 Javascript
javascript实现tab切换的两个实例
2015/11/05 Javascript
jQuery获取多种input值的简单实现方法
2016/06/20 Javascript
JavaScript基于扩展String实现替换字符串中index处字符的方法
2017/06/13 Javascript
Node.js  REPL (交互式解释器)实例详解
2017/08/06 Javascript
vue自定义键盘信息、监听数据变化的方法示例【基于vm.$watch】
2019/03/16 Javascript
[01:11]辉夜杯战队访谈宣传片—CDEC.Y
2015/12/26 DOTA
利用Python爬取可用的代理IP
2016/08/18 Python
Python PyQt5实现的简易计算器功能示例
2017/08/23 Python
使用Python3+PyQT5+Pyserial 实现简单的串口工具方法
2019/02/13 Python
pymongo中group by的操作方法教程
2019/03/22 Python
Python中捕获键盘的方式详解
2019/03/28 Python
详解PyCharm安装MicroPython插件的教程
2019/06/24 Python
使用Python快乐学数学Github万星神器Manim简介
2019/08/07 Python
Python操作远程服务器 paramiko模块详细介绍
2019/08/07 Python
使用Python项目生成所有依赖包的清单方式
2020/07/13 Python
HTML5注册页面示例代码
2014/03/27 HTML / CSS
印度最好的在线药品订购网站:PharmEasy
2018/11/30 全球购物
星空联盟C# .net笔试题
2014/12/05 面试题
市场营销专科应届生求职信
2013/11/24 职场文书
合伙协议书
2014/04/23 职场文书
年会邀请函的格式及范文五篇
2019/11/02 职场文书
七年级话题作文之执着
2019/11/19 职场文书
导游词之苏州寒山寺
2019/12/05 职场文书
Opencv实现二维直方图的计算及绘制
2021/07/21 Python