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 相关文章推荐
JavaScript 学习笔记(十四) 正则表达式
Jan 22 Javascript
通过判断JavaScript的版本实现执行不同的代码
May 11 Javascript
用js实现的模拟jquery的animate自定义动画(2.5K)
Jul 20 Javascript
js拖拽一些常见的思路方法整理
Mar 19 Javascript
javascript实现在某个元素上阻止鼠标右键事件的方法和实例
Aug 12 Javascript
全面解析Bootstrap布局组件应用
Feb 22 Javascript
js计算时间差代码【包括计算,天,时,分,秒】
Apr 26 Javascript
BootStrap的两种模态框方式
May 10 Javascript
基于AngularJS的简单使用详解
Sep 10 Javascript
详解关于react-redux中的connect用法介绍及原理解析
Sep 11 Javascript
vue将对象新增的属性添加到检测序列的方法
Feb 24 Javascript
jQuery实现本地存储
Dec 22 jQuery
完美解决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
精致的人儿就要挑杯子喝咖啡
2021/03/03 冲泡冲煮
纯真IP数据库的应用 IP地址转化成十进制
2009/06/14 PHP
通用PHP动态生成静态HTML网页的代码
2010/03/04 PHP
解析php中eclipse 用空格替换 tab键
2013/06/24 PHP
php实现根据url自动生成缩略图的方法
2014/09/23 PHP
PHP实现可自定义样式的分页类
2016/03/29 PHP
PHP登录(ajax提交数据和后台校验)实例分享
2016/12/29 PHP
Laravel如何使用Redis共享Session
2018/02/23 PHP
JavaScript判断字符长度、数字、Email、电话等常用判断函数分享
2015/04/01 Javascript
JS实现弹性菜单效果代码
2015/09/07 Javascript
jquery实现加载进度条提示效果
2015/11/23 Javascript
动态加载js文件简单示例
2016/04/21 Javascript
js实现键盘自动打字效果
2016/12/23 Javascript
JS实现京东首页之页面顶部、Logo和搜索框功能
2017/01/12 Javascript
浅谈AngularJS中$http服务的简单用法
2018/05/15 Javascript
vue自定义键盘信息、监听数据变化的方法示例【基于vm.$watch】
2019/03/16 Javascript
python将文本分每两行一组并保存到文件
2018/03/19 Python
django 在原有表格添加或删除字段的实例
2018/05/27 Python
Pandas:DataFrame对象的基础操作方法
2018/06/07 Python
Tensorflow使用tfrecord输入数据格式
2018/06/19 Python
python与caffe改变通道顺序的方法
2018/08/04 Python
10款最好的Python开发编辑器
2019/07/03 Python
关于numpy.where()函数 返回值的解释
2019/12/06 Python
Python使用monkey.patch_all()解决协程阻塞问题
2020/04/15 Python
CSS3 @media的基本用法总结
2019/09/10 HTML / CSS
探讨HTML5移动开发的几大特性(必看)
2015/12/30 HTML / CSS
使用canvas对多图片拼合并导出图片的方法
2018/08/28 HTML / CSS
苹果美国官方商城:Apple美国
2016/08/24 全球购物
牵手50台湾:专为黄金岁月的单身人士而设的交友网站
2021/02/18 全球购物
公司联欢会策划方案
2014/05/19 职场文书
幼儿园标语大全
2014/06/19 职场文书
酒店七夕情人节活动策划方案
2014/08/24 职场文书
关于读书的演讲稿400字
2014/08/27 职场文书
党员转正申请报告
2015/05/15 职场文书
大学生如何逃脱“毕业季创业队即散伙”魔咒?
2019/08/19 职场文书
python实现双链表
2022/05/25 Python