效果:
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 < 1) {
$(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 < 1) {
current = 1;
}
if
(current > total) {
current = total;
}
var
endIndex = total;
var
startIndex = 1;
var
temp = current + Math.floor(count / 2);
if
(temp < total) {
if
(temp < count) {
endIndex = count;
}
else
{
startIndex = temp - count + 1;
endIndex = temp;
}
}
else
{
if
(total > count) {
startIndex = total - count + 1;
}
}
$(
"#_number"
).empty();
for
(
var
i = startIndex; i <= endIndex; i++) {
var
html = $(
"<span></span>"
).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(
"<span id='_left'><span id='_first' class='spcial'>首页</span> <span id='_pre' class='spcial'>上一页</span></span> <span id='_number'></span><span id='_go'><input id='_pos' type='text'/><input id='_to' type='button' value='GO'/></span> <span id='_right'><span id='_next' class='spcial'>下一页</span> <span id='_last' class='spcial'>末页</span></span><input id='_tot' type='hidden'/>"
);
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:
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<Person> GetPersons(
string
name,
int
pageIndex,
int
paseSize)
{
return
new
PageObject<Person>(){RecordCount = 23,SearchResult =
new
List<Person>(){
new
Person(){Name=
"zhpulq"
,Age = 28},
new
Person(){Name =
"zhouxy"
,Age = 24}}};
}
}
public
class
PageObject<T>
{
public
int
RecordCount {
get
;
set
; }
public
List<T> SearchResult {
get
;
set
; }
}
}