效果:
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()), }; 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 (索引) { if (索引 > 总计) { $(token).JPager(cfg, 总计, 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).替换(/%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 (当前>总计) { 当前 = 总计; } var endIndex = 总计; var startIndex = 1; var temp = 当前 Math.floor(count / 2); if (temp if (temp endIndex = count; } else { startIndex = temp - 计数 1; endIndex = 临时; } } else { if (总计 > 计数) { startIndex = 总计 - 计数 1; } } $("#_number").empty(); for (var i = startIndex; i var html = $(" ").text(i).bind("click" ,页码); 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(总计); $("#_pos").bind("blur", checkGoNumber); $("#_to").bind("点击", pageGo); changeState(总计); 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", 数据: d, 成功: 函数 (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; } } }