效果：
js：
复制代码 代码如下:
$.fn.extend({ jpager: function (cfg, pageindex, pagesize) {
if (cfg && pageindex > 0 && pagesize>0) {
var token = # + this.attr(id);
this.empty();
var pagefirst = function () {
$(token).jpager(cfg, 1, pagesize);
};
var pagepre = function () {
$(token).jpager(cfg, pageindex - 1, pagesize);
};
var pagelast = function () {
$(token).jpager(cfg, parseint($(#_tot).val()), pagesize);
};
var pagenext = function () {
$(token).jpager(cfg, pageindex + 1, pagesize);
};
var pagenumber = function () {
$(token).jpager(cfg, parseint($(this).text()), pagesize);
};
var pagego = function () {
var index = parseint($(#_pos).val());
var total = parseint($(#_tot).val());
if (index) {
if (index > total) {
$(token).jpager(cfg, total, pagesize);
}
else if (index $(token).jpager(cfg, 1, pagesize);
}
else {
$(token).jpager(cfg, index, pagesize);
}
}
};
var checkgonumber = function () {
if (!number(this.value)) {
this.value = ;
}
else {
this.value = number(this.value);
}
};
var initcustomer = function (recordcount) {
if (cfg.customer) {
if (cfg.customer.template) {
var t = cfg.customer.template;
t = t.replace(/\%total\%/gi, math.ceil(recordcount / pagesize)).replace(/\%current\%/gi, pageindex).replace(/\%recordcount\%/gi, recordcount).replace(/\%pagesize\%/gi, pagesize);
if (cfg.customer.position == right) {
$(#_right).after(t);
}
else {
$(#_left).before(t);
}
}
}
};
var changestate = function (total) {
if (pageindex == 1) {
$(#_first).attr(class, unable);
$(#_pre).attr(class, unable);
}
else {
$(#_first).bind(click, pagefirst).attr(class, number);
$(#_pre).bind(click, pagepre).attr(class, number);
}
if (pageindex == total) {
$(#_last).attr(class, unable);
$(#_next).attr(class, unable);
}
else {
$(#_last).bind(click, pagelast).attr(class, number);
$(#_next).bind(click, pagenext).attr(class, number);
}
};
var initnumber = function (total, count, current) {
if (total > 0 && count > 0) {
if (current current = 1;
}
if (current > total) {
current = total;
}
var endindex = total;
var startindex = 1;
var temp = current + math.floor(count / 2);
if (temp if (temp endindex = count;
}
else {
startindex = temp - count + 1;
endindex = temp;
}
}
else {
if (total > count) {
startindex = total - count + 1;
}
}
$(#_number).empty();
for (var i = startindex; i var html = $().text(i).bind(click, pagenumber);
if (i == current) {
$(#_number).append(html.attr(class, selected));
}
else {
$(#_number).append(html.attr(class, number));
}
}
}
};
var initpager = function (data) {
if ($.isarray(data.searchresult) && data.recordcount > 0) {
$(token).append(首页 上一页 下一页 末页);
var total = math.ceil(data.recordcount / pagesize);
$(#_tot).val(total);
$(#_pos).bind(blur, checkgonumber);
$(#_to).bind(click, pagego);
changestate(total);
if (cfg.shownumber && cfg.count > 0) {
initnumber(total, cfg.count, pageindex);
}
initcustomer(data.recordcount);
}
};
if (cfg.action) {
if (cfg.action.url && cfg.action.data) {
var d = cfg.action.data.substr(0, cfg.action.data.lastindexof(})) + ',pageindex:' + pageindex + ',pagesize:' + pagesize + };
if (cfg.action.callback && $.isfunction(cfg.action.callback)) {
$.ajax({
type: post,
url: cfg.action.url,
datatype: json,
contenttype: text/json,
data: d,
success: function (data) {
initpager(data.d);
cfg.action.callback(data.d);
}
});
}
else {
$.ajax({
type: post,
url: cfg.action.url,
datatype: json,
contenttype: text/json,
data: d,
success: function (data) {
initpager(data.d);
}
});
}
}
}
}
}
});
css：
复制代码 代码如下:
#_pos {
width: 40px;
}
.unable
{
color: #bcc0bb;
}
.number
{
margin: 2px;
color:#0000ff;
text-decoration:underline;
}
.selected
{
margin: 2px;
color: #ff0000;
font-weight: bold;
}
html：
复制代码 代码如下:
分页控件示例
wcf：
复制代码 代码如下:
using system;
using system.collections.generic;
using system.linq;
using system.runtime.serialization;
using system.servicemodel;
using system.servicemodel.activation;
using system.servicemodel.web;
namespace jplugin
{
[servicecontract]
[aspnetcompatibilityrequirements(requirementsmode = aspnetcompatibilityrequirementsmode.allowed)]
public class jservice
{
[operationcontract]
[webinvoke]
public pageobject getpersons(string name,int pageindex,int pasesize)
{
return new pageobject(){recordcount = 23,searchresult = new list(){new person(){name=zhpulq,age = 28},new person(){name = zhouxy,age = 24}}};
}
}
public class pageobject
{
public int recordcount { get; set; }
public list searchresult { get; set; }
}
}