js分页

; (function ($) {
$.extend({
"easypage": function (options) {
options = $.extend({
CallbackFunction: undefined, //获取内容的ajax方法名字
pageindex: undefined,
DATACOUNT: undefined,
navigateid: "AjaxPage",
everycount: 5//每页显示多少个
}, options);

if (options.CallbackFunction == undefined || options.pageindex == undefined ||
options.DATACOUNT == undefined || options.navigateid == undefined) {
return false;
}

var currentpage = options.pageindex; //当前页
var contentcount = options.DATACOUNT; //数据长度
var pagecount = Math.ceil(contentcount / options.everycount); // 有多少页

//显示分页
$.extend({
"showpage": function (Pageindex) {

if (pagecount <= 1) {
$("#" + options.navigateid).empty();
return false
}
Pageindex = Pageindex >= pagecount ? pagecount : Pageindex;
var navigatehtml = " <table id=\"PageTable\"> <tr>";


if (Pageindex == 1) {
navigatehtml += "<td> <img src=\"/Communicate_static/images/page.png\" /> </td>";
}
else {
navigatehtml += "<td class=\"LastPage\" > <img src=\"/Communicate_static/images/page2.png\" /> </td>";
}


if (pagecount <= 9) {
for (var i = 1; i <= pagecount; i++) {
if (i == Pageindex) {
navigatehtml += "<td class=\"pager-active\">" + i + "</td>";
}
else {
navigatehtml += "<td class=\"pageNumber\">" + i + "</td>";
}
}
}

else if (Pageindex <= 5) {
for (var i = 1; i < 7; i++) {
if (i == Pageindex) {
navigatehtml += "<td class=\"pager-active\">" + i + "</td>";
}
else {
navigatehtml += "<td class=\"pageNumber\">" + i + "</td>";
}
}
navigatehtml += "<td class=\"pager-dot\">...</td>";
navigatehtml += "<td class=\"pageNumber\">" + pagecount + "</td>";
}


else if (Pageindex >= pagecount - 4) {
navigatehtml += "<td class=\"pageNumber\">1</td>";
navigatehtml += "<td class=\"pager-dot\">...</td>";
for (var i = pagecount - 6; i <= pagecount; i++) {
if (i == Pageindex) {
navigatehtml += "<td class=\"pager-active\">" + i + "</td>";
}
else {
navigatehtml += "<td class=\"pageNumber\">" + i + "</td>";
}

}
}


else {
navigatehtml += "<td class=\"pageNumber\">1</td>";
navigatehtml += "<td class=\"pager-dot\">...</td>";
for (var i = Pageindex - 2; i <= Pageindex + 2; i++) {
if (i == Pageindex) {
navigatehtml += "<td class=\"pager-active\">" + i + "</td>";
}
else {
navigatehtml += "<td class=\"pageNumber\">" + i + "</td>";
}
}
navigatehtml += "<td class=\"pager-dot\">...</td>";
navigatehtml += "<td class=\"pageNumber\">" + pagecount + "</td>"
}


if (pagecount == Pageindex) {
navigatehtml += "<td><img src=\"/Communicate_static/images/page4.png\" /></td>";
} else {
navigatehtml += "<td class=\"NextPage\"><img src=\"/Communicate_static/images/page1.png\" /></td>";
}

navigatehtml += "<td class=\"pager-empty\"></td><td> <input type=\"text\" id=\"goPage\" value=\"" + Pageindex + "\" /> </td> <td class=\"pager-active\" id=\"go\">Go</td>";

navigatehtml += "</tr></table>";

$("#" + options.navigateid).empty();
$("#" + options.navigateid).append(navigatehtml);


}

});


//点击页号跳转页面
$.extend({
"PageNumber": function () {
$(".pageNumber").click(function () {
options.CallbackFunction(parseInt($(this).html()));
})
}
});

//下一页
$.extend({
"Nextpage": function () {
$(".NextPage").click(function () {
currentpage++;
options.CallbackFunction(currentpage);
})
}
});

//上一页
$.extend({
"LastPage": function () {
$(".LastPage").click(function () {
currentpage--;
options.CallbackFunction(currentpage);
})
}
});

//点击Go跳转页面
$.extend({
"gopage": function () {
$("#go").click(function () {
var pageval = $("#goPage").val();
if (isNaN(pageval)) {
$("#goPage").val("");
return false;
}
if (pageval > pagecount) {
pageval = pagecount;
}
currentpage = parseInt(pageval);
options.CallbackFunction(currentpage);
})
}
});

//显示页码
$.showpage(currentpage);

//点击触发分页
$.PageNumber();

//上一页
$.LastPage();

// 下一页
$.Nextpage();

//跳转页面
$.gopage();

}
})

}
)(jQuery);

posted @ 2016-08-17 17:03  haifeng_0712  阅读(121)  评论(0编辑  收藏  举报