(function ($) {
$.fn.pager = function (recordCount, options) {
var defaults = {
//只有一页时是否仍然显示
alwaysShow: false,//是否一直显示
isshowfirstend: true,//是否显示首页末页
isshowprevnext: true,//是否显示上一页下一页
isshowNumber: false,//是否显示数字
isshowPgTotal: false,//是否显示数字
isshowJump: false,//是否显示跳转框
width: 500,
currentPageIndex: 1,//当前页面
pageSize: 10,//每页条数
onPageIndexChanged: function () { },//翻页方法
pageid: "",//输出导航的容器id
prevpgid: "mark=pagerprev",//操纵上一页的id
nextpgid: "mark=pagernext",//操纵下一页的id
firstpgid: "mark=pagerfirst",//操纵首页的id
endpgid: "mark=pagerend",//操纵末页的id
numpgid: "mark=pagernum",//操纵数字按钮的id
pginputid: "mark=pginput",//操纵跳转的输入框id
pgjumpid: "mark=pgjump",//操纵跳转的按钮id
firstpgtext: "首页",//首页显示的文字
endpgtext: "末页",//末页显示文字
prevpgtext: "上一页",//上一页显示的文字
newxtpgtext: "下一页",//下一页显示的文字
parentPageClass: "shop_listpage",//分页导航的总样式
unabledClass: "disabled",//不可用按钮的样式
jumpInputClass: "shop_int01",//跳转输入框的样式
jumpButtonClass: "shop_int02",//跳转按钮的样式
numberSelectClass:"shop_int03",//数字选中样式
};
var props = $.extend(defaults, options);
var pageCount = Math.ceil((recordCount / props.pageSize));
//当数据不满一页时,是否显示pager
if (recordCount > props.pageSize || props.alwaysShow) {
var text = "<div class=\""+props.parentPageClass+"\">";
if (props.isshowfirstend) {
text += "<a href=\"javascript:void(0)\" " + props.firstpgid + ">" + props.firstpgtext + "</a>";
}
if (props.isshowprevnext)
{
if (props.currentPageIndex == 1) {
text += "<a href=\"javascript:void(0)\" class=\"" + props.unabledClass + "\"" + props.prevpgid + ">" +
props.prevpgtext + "</a>";
}
else {
text += "<a href=\"javascript:void(0)\"" + props.prevpgid + ">"+props.prevpgtext+"</a>";
}
}
if (props.isshowNumber)
{
if (props.currentPageIndex < 6) {
for (var i = 1; i <=9; i++) {
text += "<a href=\"javascript:void(0)\" class=\"" + (i == props.currentPageIndex ? props.numberSelectClass
: "") + "\" pgdata=\"" + i + "\"" + props.numpgid + ">" + i + "</a>";
}
}
else if (props.currentPageIndex<pageCount - 4) {
text += "<a href=\"javascript:void(0)\" " + props.numpgid + " pgdata=\"" +(props.currentPageIndex - 5) + "\"
>...</a>";
for (var i = props.currentPageIndex - 4; i <= props.currentPageIndex + 4; i++) {
text += "<a href=\"javascript:void(0)\" class=\"" + (i == props.currentPageIndex ? props.numberSelectClass
: "") + "\"" + props.numpgid + " pgdata=\"" + i + "\" >" + i + "</a>";
}
text += "<a href=\"javascript:void(0)\" " + props.numpgid + " pgdata=\"" + (props.currentPageIndex+5) + "\"
>...</a>";
}
else {
text += "<a href=\"javascript:void(0)\" " + props.numpgid + " pgdata=\"" + (pageCount - 9) + "\" >...</a>";
for (var i =(pageCount-8); i<=pageCount; i++) {
text += "<a href=\"javascript:void(0)\" class=\"" + (i == props.currentPageIndex ? props.numberSelectClass
: "") + "\"" + props.numpgid + " pgdata=\"" + i + "\" >" + i + "</a>";
}
}
}
if (props.isshowprevnext)
{
if (props.currentPageIndex < pageCount) {
text += "<a href=\"javascript:void(0)\"" + props.nextpgid + ">"+props.newxtpgtext+"</a>";
}
else {
text += "<a href=\"javascript:void(0)\" class=\""+props.unabledClass+"\"" + props.nextpgid +
">"+props.newxtpgtext+"</a>";
}
}
if (props.isshowfirstend)
{
text += "<a href=\"javascript:void(0)\" " + props.endpgid + ">" + props.endpgtext + "</a>";
}
if (props.isshowPgTotal) {
text += "<span>" + props.currentPageIndex + "/" + (pageCount == 0 ? 1 : pageCount) + "页</span>";
}
if (props.isshowJump) {
text += "<span>跳转到第<input type=\"text\" class=\"" + props.jumpInputClass + "\"" + props.pginputid + " value=
\"" + props.currentPageIndex + "\">页</span><input type=\"submit\" value=\"确定\" class=\"" + props.jumpButtonClass + "\"" +
props.pgjumpid + "></div>";
}
$(props.pageid).html(text);
$("a["+props.prevpgid+"]").click(function () {
if (props.currentPageIndex > 1) {
raisePageIndexChangedEvent(--props.currentPageIndex);
}
});
$("a[" + props.firstpgid + "]").click(function () {
raisePageIndexChangedEvent(1);
});
$("a[" + props.endpgid + "]").click(function () {
raisePageIndexChangedEvent(pageCount);
});
$("a[" + props.nextpgid + "]").click(function () {
if (props.currentPageIndex < pageCount) {
raisePageIndexChangedEvent(++props.currentPageIndex);
}
});
$("a[" + props.numpgid + "]").click(function () {
raisePageIndexChangedEvent(Number($.trim($(this).attr("pgdata"))));
});
$("input[" + props.pgjumpid + "]").click(function () {
if (Number($.trim($("input[" + props.pginputid + "]").val())) <= pageCount && Number($.trim($("input[" +
props.pginputid + "]").val()))>0) {
raisePageIndexChangedEvent(Number($.trim($(this).prev("span").find("input[" + props.pginputid + "]").val
())).toFixed(0));
}
else if (Number($.trim($("input[" + props.pginputid + "]").val()))>pageCount) {
raisePageIndexChangedEvent(pageCount);
}
else if (Number($.trim($("input[" + props.pginputid + "]").val()))<=0)
{
raisePageIndexChangedEvent(1);
}
});
}
function raisePageIndexChangedEvent(pageIndex) {
props.onPageIndexChanged(pageIndex);
}
};
})(jQuery);
前台调用代码:
1 $.fn.pager(msg.total, { pageid: "div[data-page=ShowPageDown]", onPageIndexChanged: LoadPorList, currentPageIndex: pageIndex, pageSize: 10 });
1 LoadPorList = function (pageIndex) {
2 $.ajax({
3 type: "POST",
4 url: "/Exhibition/ExhibitManage/LoadProList/",
5 datatype: "json",
6 data: { pg: pageIndex, type: $.trim($("#TabPro>span.cur").attr("mark")), pageSize: 10 },
7 success: function (msg) {
8 if (msg != "") {
9 eval(msg);
10 $("#TabPro .colf60").html(msg.total);
11 $("#ProListDiv").html(msg.myprolist);
12 FindPro();
13 $.fn.pager(msg.total, { pageid: "div[data-page=ShowPageDown]", onPageIndexChanged: LoadPorList, currentPageIndex: pageIndex, pageSize: 10 });
14 }
15 }
16 });
17 };