//每次只显示5个页码
(function ($) {
//设定页码方法,初始化
$.fn.setPager = function (options) {

var opts = $.extend({}, pagerDefaults, options);
return this.each(function () {
$(this).empty().append(setPagerHtml(parseInt(options.RecordCount), parseInt(options.PageIndex), parseInt(options.PageSize), options.buttonClick));

});
};
//设定页数及html
function setPagerHtml(RecordCount, PageIndex, PageSize, pagerClick) {

var $content = $("<ul class=\"pages\"></ul>");
var startPageIndex = 1;
//若页码超出
if (RecordCount <= 0) RecordCount = PageSize;
//末页
var endPageIndex = parseInt(RecordCount % parseInt(PageSize)) > 0 ? parseInt(RecordCount / parseInt(PageSize)) + 1 : RecordCount / parseInt(PageSize)

if (PageIndex > endPageIndex) PageIndex = endPageIndex;
if (PageIndex <= 0) PageIndex = startPageIndex;
var nextPageIndex = PageIndex + 1;
var prevPageIndex = PageIndex - 1;
if (PageIndex == startPageIndex) {
$content.append($("<li><span class=\"beginEnd\">首页</span></li>"));
$content.append($("<li><span class=\"beginEnd\">上一页</span></li>"));
} else {

$content.append(renderButton(RecordCount, 1, pagerClick, "<span class=\"beginEnd\">首页</span>"));
$content.append(renderButton(RecordCount, prevPageIndex, pagerClick, "<span class=\"beginEnd\">上一页</span>"));
}
//这里判断是否显示页码
if (pagerDefaults.ShowPageNumber) {
// var html = "";
//页码部分隐藏 只显示中间区域
if (endPageIndex <= 5 && PageIndex <= 5) {
for (var i = 1; i <= endPageIndex; i++) {
if (i == PageIndex) {

$content.append($("<li><span class=\"current\">" + i + "</span></li>"));
} else {
$content.append(renderButton(RecordCount, i, pagerClick, i));
}

}

} else if (endPageIndex > 5 && endPageIndex - PageIndex <= 2) {

$content.append($("<li class=\"dotted\">...</li>"));
for (var i = endPageIndex - 4; i <= endPageIndex; i++) {
if (i == PageIndex) {

$content.append($("<li><span class=\"current\">" + i + "</span></li>"));
} else {
$content.append(renderButton(RecordCount, i, pagerClick, i));
}

}
} else if (endPageIndex > 5 && PageIndex > 3) {

$content.append($("<li class=\"dotted\">...</li>"));
for (var i = PageIndex - 2; i <= PageIndex + 2; i++) {
if (i == PageIndex) {

$content.append($("<li><span class=\"current\">" + i + "</span></li>"));
} else {
$content.append(renderButton(RecordCount, i, pagerClick, i));
}

}
$content.append($("<li class=\"dotted\">...</li>"));

} else if (endPageIndex > 5 && PageIndex <= 3) {

for (var i = 1; i <= 5; i++) {
if (i == PageIndex) {

$content.append($("<li><span class=\"current\">" + i + "</span></li>"));
} else {
$content.append(renderButton(RecordCount, i, pagerClick, i));
}

}
$content.append($("<li class=\"dotted\">...</li>"));
}
}
if (PageIndex == endPageIndex) {
$content.append($("<li><span class=\"beginEnd\">下一页</span></li>"));
$content.append($("<li><span class=\"beginEnd\">末页</span></li>"));
} else {
$content.append(renderButton(RecordCount, nextPageIndex, pagerClick, "<span class=\"beginEnd\">下一页</span>"));
$content.append(renderButton(RecordCount, endPageIndex, pagerClick, "<span class=\"beginEnd\">末页</span>"));
}

return $content;
}
function renderButton(recordCount, goPageIndex, EventHander, text) {
var $goto = $("<li><a>" + text + "</a></li>\"");
$goto.click(function () {

EventHander(recordCount, goPageIndex);
});
return $goto;
}
var pagerDefaults = {
DefaultPageCount: 1,
DefaultPageIndex: 1,
PageSize: 10,
ShowPageNumber: true //是否显示页码
};
})(jQuery);

//pagerDefaults.PageSize

jquery自定义分页插件的更多相关文章

  1. Jquery前端分页插件pagination使用

    插件描述:JqueryPagination是一个轻量级的jquery分页插件.只需几个简单的配置就可以生成分页控件.并且支持ajax获取数据,自定义请求参数,提供多种方法,事件和回调函数,功能全面的分 ...

  2. 转:精心挑选的12款优秀 jQuery Ajax 分页插件和教程

    在这篇文章中,我为大家收集了12个基于 jQuery 框架的 Ajax 分页插件,这些插件都提供了详细的使用教程和演示.Ajax 技术的出现使得 Web 项目的用户体验有了极大的提高,如今借助优秀的  ...

  3. jQuery Pagination分页插件

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. Jquery的分页插件

    Jquery的分页插件, 用起来还不错. 来自: http://flaviusmatis.github.io/simplePagination.js/   下载地址: https://github.c ...

  5. 12款优秀 jQuery Ajax 分页插件和教程

    12款优秀 jQuery Ajax 分页插件和教程 在这篇文章中,我为大家收集了12个基于 jQuery 框架的 Ajax 分页插件,这些插件都提供了详细的使用教程和演示.Ajax 技术的出现使得 W ...

  6. jQuery Pagination分页插件--刷新

    源码地址:https://github.com/SeaLee02/FunctionModule/blob/master/UploadFiles/WebDemo/FenYE/FenYeDemo.aspx ...

  7. Jquery前端分页插件pagination同步加载和异步加载

    上一篇文章介绍了Jquery前端分页插件pagination的基本使用方法和使用案例,大致原理就是一次性加载所有的数据再分页.https://www.jianshu.com/p/a1b8b1db025 ...

  8. MyBatis-编写自定义分页插件

    一.基础知识 本文测试和源码分析参考版本: Mybatis-version:3.5.5 本文相关测试源代码:https://github.com/wuya11/mybatis_demo 1.1 参考方 ...

  9. 炫酷JQUERY自定义对话框插件JDIALOG_JDIALOG弹出对话框和确认对话框插件

    多种类型自定义对话框插件jDialog是一款基于jquery实现的轻量级多种类型的自定义对话框插件 在项目开发中.一般会美化 alert(); 的样式.那么今天我就和大家分享一款非常炫的插件 先来看一 ...

随机推荐

  1. JAVA并发,线程工厂及自定义线程池

    package com.xt.thinks21_2; import java.util.concurrent.ExecutorService; import java.util.concurrent. ...

  2. 当cpu飙升时,找出php中可能有问题的代码行

    参考大牛: http://www.searchtb.com/2014/04/%E5%BD%93cpu%E9%A3%99%E5%8D%87%E6%97%B6%EF%BC%8C%E6%89%BE%E5%8 ...

  3. 关于JQuery中$.data绑定数据原理或逻辑

    问题: JQuery中,对于.data([key],[value])函数,当使用其进行数据绑定时,假设要绑定的数据是“引用数据类型”,也就是对象:那么.data函数绑定的是该对象的副本还是该对象的一个 ...

  4. NYOJ 527 AC_mm玩dota

    AC_mm玩dota 时间限制:1000 ms  |  内存限制:65535 KB 难度:2 描述 大家都知道AC_mm比较喜欢玩游戏,特别是擅长war3这款经典游戏.某天AC_mm来到了VS平台上 ...

  5. 数字信号处理Day1自制电子音乐

    第一天的课程感觉比較简单,主要介绍Karplus-Strong Algorithm 给出方程 y[n]=αy[n−M]+x[n], x[n]是输入,M是延迟,α是衰弱系数 我们要衰减D次,总的採样数就 ...

  6. 详解Objective-C中委托和协议

    Objective-C委托和协议本没有任何关系,协议如前所述,就是起到C++中纯虚类的作用,对于“委托”则和协议没有关系,只是我们经常利用协议还实现委托的机制,其实不用协议也完全可以实现委托. AD: ...

  7. 在unity 脚本中获取客户端的IP地址

    需要using System.Net.NetworkInformation;原理就是获取网卡的信息. //下面这段代码是我在百度贴吧找来的,经检验是正确的 string userIp = " ...

  8. IIS网站发布容易出现的几个问题

    1. 更新版本或者重新安装.net Framework: 2. 更改配置文件节点: 3. 访问权限问题的更改:

  9. LINQ实现行列转换

    用SQL语句实现行列转换很容易,但也有时候需要在程序中实现,找了好久,发现一篇文章写的挺不错的 http://blog.csdn.net/smartsmile2012/article/details/ ...

  10. MD5随机散列加密算法

    项目中需要在登录验证用户名.密码的时候对密码进行加密处理,由于是比较商业化的软件,所以安全方面还是必须要考虑的.而使用MD5随机散列加密算法使得密码加密后不可逆,很大程度上提升了安全性.废话不多说,看 ...