模板分页封装

var ajaxCommFunPage = function(url, data, callback) {
jQuery.ajax({
type : "post",
async: false,
//dataType:'html',
url : url,
timeout: 30000,
data : data,
success : callback
});
};

var asyncSubmit = function(formId){
var formObj = $('#'+formId);
var asyncFlag = formObj.find("input[name='asyncFlag']").val();
var prefix = formObj.find("input[name='alias']").val();
var replaceId = formObj.find("input[name='replaceId']").val();

$('#currentPageHid_'+prefix).val(1);
if(asyncFlag=='true'){
var url = getContextPath() + formObj.attr('action');
ajaxCommFunPage(url, formObj.serialize(), function(str){
var ss = $(str).find('#'+replaceId).html();
$('#'+replaceId).html(ss);
});
}else{
formObj.submit();
}
};

var search = function(json,currentPage, pageSize) {
var formId = json["formId"];
var asyncFlag  = json["asyncFlag"];
var prefix  = json["prefix"];
var replaceId = json["replaceId"];
if(replaceId == null){
replaceId = json["formId"];
}

$('#currentPageHid_'+prefix).val(currentPage);
$('#pageSizeHid_'+prefix).val(pageSize);

var  formObj = $("#"+formId);

var url = getContextPath() + formObj.attr('action');
if(asyncFlag){
ajaxCommFunPage(url, formObj.serialize(), function(str){
var ss = $(str).find('#'+replaceId).html();
$("#"+replaceId).html(ss);
});
}else{
formObj.submit();
}
};

function initPageTab(json){

initBaicPageByFM(json);
};

var initBaicPageByFM=function (json){
var formId = json["formId"];//form表单的Id
var divId = json["divId"];//form表单内分页标签的DIVId
var asyncFlag  = json["asyncFlag"];//刷新，无刷新标志
var prefix = json["prefix"];//分页标签的标志
var currentPage = json["currentPage"];//当前页
var totalPage = json["totalPage"];//一共多少页
var count = json["count"];//总数
var pageSize = json["pageSize"];//每页多少条
var replaceId = json["replaceId"];//需要替换的ID
if(replaceId == null){
replaceId = json["formId"];
}

//初始化页面
var str = $('#'+divId).html();
str = str.replace(/currentPageAlias/g,currentPage);
str = str.replace(/totalPageAlias/g,totalPage);
str = str.replace(/countAlias/g,count);
str = str.replace(/pageSizeAlias/g,pageSize);
str = str.replace(/asyncFlagAlias/g,asyncFlag);
str = str.replace(/aliasAlias/g,prefix);
str = str.replace(/replaceIdAlias/g,replaceId);
str = str.replace(/prefix/g,prefix);

var pageDiv = $('#'+divId);
pageDiv.html(str);
var pageStr = getPageSrc(currentPage,pageSize,totalPage,count);

//设置页面
$('#pagingitem_'+prefix).html(pageStr);
//设置总数
$('#totalpage_'+prefix).html(count);

pageDiv.find('[tag=paging-action]').click(function() {
search(json,std.oid(this),pageSize);
});

pageDiv.find('#gotoNo_'+prefix).delegate(this,'click',function() {
goToCurrPageBtn(json,pageSize,totalPage,'pageNo');
});

pageDiv.find('#pageNo_'+prefix).delegate(this,'keypress',function(e) {
if (e && e.keyCode == 13) {
goToCurrPageBtn(json,pageSize,totalPage,'pageNo');
}
});
};

var initBaicPage=function (json){
var formId = json["formId"];//form表单的Id
var divId = json["divId"];//form表单内分页标签的DIVId
var asyncFlag  = json["asyncFlag"];//刷新，无刷新标志
var prefix = json["prefix"];//分页标签的标志
var currentPage = json["currentPage"];//当前页
var totalPage = json["totalPage"];//一共多少页
var count = json["count"];//总数
var pageSize = json["pageSize"];//每页多少条
var replaceId = json["replaceId"];//需要替换的ID
if(replaceId == null){
replaceId = json["formId"];
}

//初始化页面
var str = $('#'+divId).html();
str = str.replace(/currentPageAlias/g,currentPage);
str = str.replace(/totalPageAlias/g,totalPage);
str = str.replace(/countAlias/g,count);
str = str.replace(/pageSizeAlias/g,pageSize);
str = str.replace(/asyncFlagAlias/g,asyncFlag);
str = str.replace(/aliasAlias/g,prefix);
str = str.replace(/replaceIdAlias/g,replaceId);
str = str.replace(/prefix/g,prefix);

$('#'+divId).html(str);

//绑定事件
$('#firstPage_'+prefix).delegate(this,'click', function() {
firstPage(json,1,pageSize);
});
$('#prePage_'+prefix).delegate(this,'click', function() {
prePage(json,currentPage,totalPage,pageSize);
});

$('#nextPage_'+prefix).delegate(this,'click', function() {
nextPage(json,currentPage,totalPage,pageSize);
});

$('#finalPage_'+prefix).delegate(this,'click', function() {
finalPage(json,totalPage,pageSize);
});

$('#finalPage_'+prefix).delegate(this,'click', function() {
finalPage(json,totalPage,pageSize);
});

$('#goToCurrPageBtn_'+prefix).delegate(this,'click', function() {
goToCurrPageBtn(json,pageSize,totalPage);
});

$('#currPageIpt_'+prefix).delegate(this,'keypress', function(event) {
if(event.keyCode == "13")
{
goToCurrPageBtn(json,pageSize,totalPage);
}
});

};

var prePage = function(json,currentPage, totalPage, pageSize) {
if (currentPage <= 1) {
currentPage = 1;
} else {
currentPage = currentPage - 1;
}
search(json,currentPage, pageSize);
};
var nextPage = function(json,currentPage, totalPage, pageSize) {
if (currentPage >= totalPage) {
currentPage = totalPage;
} else {
currentPage = currentPage + 1;
}
search(json,currentPage, pageSize);
};

var firstPage = function(json,currentPage, pageSize) {
search(json,currentPage, pageSize);
};

var finalPage = function(json,currentPage, pageSize) {
search(json,currentPage, pageSize);
};

var goToCurrPageBtn = function(json,pageSize, totalPage,keyId) {
var prefix = json["prefix"];
var currPageIptObj = null;
if(keyId==null){
currPageIptObj = $("#currPageIpt_"+prefix);
}else{
currPageIptObj = $("#"+keyId+"_"+prefix);
}
var currPageIpt = currPageIptObj.val();
if (currPageIpt == "") {
currPageIptObj.val("");
win.msg.short("请输入跳转页数!", "W01");
} else if (parseInt(currPageIpt) > totalPage) {
currPageIptObj.val("");
win.msg.short("你输入的页数超出总页数，请输入正确的页数!", "W01");
} else if (parseInt(currPageIpt) <= 0) {
currPageIptObj.val("");
win.msg.short("你输入的页数小于1，请输入正确的页数！", "W01");
} else {
search(json,parseInt(currPageIpt), pageSize);
}
};

var getPageSrc = function(currentpage,pagesize,totalpage,totalsize){

var pg = {};
pg.currentpage = parseInt(currentpage);
pg.pagesize = parseInt(pagesize);
pg.totalpage = parseInt(totalpage);
pg.totalsize = parseInt(totalsize);

if (pg.totalpage <= 5) {//五页内
var middle = [];
for (var num = 1; num <= pg.totalpage; num++) {
middle.push(num);
}
return renderDom(middle, pg.currentpage, false, false,pg);

} else if (pg.currentpage <= 3) {//当前页为3页内
var middle = [ 1, 2 ];
if (pg.currentpage >= 2) {
middle.push(3);
}
if (pg.currentpage >= 3) {
middle.push(4);
}
return renderDom(middle, pg.currentpage, false, true,pg);

} else if (pg.totalpage - pg.currentpage <= 2) {//当前页为倒数三页内
var middle = [];
if (pg.currentpage <= pg.totalpage - 2) {
middle.push(pg.totalpage - 3);
}
if (pg.currentpage <= pg.totalpage - 1) {
middle.push(pg.totalpage - 2);
}
middle.push(pg.totalpage - 1);
middle.push(pg.totalpage);

return renderDom(middle, pg.currentpage, true, false,pg);

} else {//当前页在中间
return renderDom([ pg.currentpage - 1, pg.currentpage, pg.currentpage + 1 ], pg.currentpage, true, true,pg);
}
};

var renderDom = function(middle, active, showMore1, showMore2,pg) {
var html = '<div class="c_page_num"' + std.flag('paging-action', (active > 1 ? active - 1 : 1)) + '><</div>';
if (showMore1) {
html += '<div class="c_page_num"' + std.flag('paging-action', 1) + '>1</div><div class="c_page_more">...</div>';
}
$(middle).each(function(key, item) {
html += '<div class="c_page_num ' + (active == item ? 'active' : '') + '"' + std.flag('paging-action', item) + '>' + item + '</div>';
});
if (showMore2) {
html += '<div class="c_page_more">...</div><div class="c_page_num"' + std.flag('paging-action',pg.totalpage) + '>' +pg.totalpage + '</div>';
}
html += '<div class="c_page_num"' + std.flag('paging-action', (active <pg.totalpage ? active + 1 :pg.totalpage)) + '>></div>';

return html;
};

<div class="c_page c_fr c_mt15 c_mb15 search-list-paging">

<div tag="paging-item" id="pagingitem_prefix">

</div>
<div class="c_page_goto">
共<span tag="paging-info" oid="totalpage" id="totalpage_prefix"></span>条
</div>
<div class="c_page_goto">跳转至</div>
<div class="c_page_input">
<input type="text" tag="paging-input" oid="pageNo" id=pageNo_prefix value="currentPageAlias">
</div>
<div class="c_page_goto" tag="paging-button" oid="gotoNo" id="gotoNo_prefix">
<i>GO</i>
</div>
</div>

<input id="currentPageHid_prefix" type="hidden" name="currentPage" value="currentPageAlias" class="pageTxt" />
<input id="pageSizeHid_prefix" type="hidden" name="pageSize" value="pageSizeAlias" class="pageTxt" />
<input id="asyncFlagHid_prefix" type="hidden" name="asyncFlag" value="asyncFlagAlias" class="pageTxt" />
<input id="aliasHid_prefix" type="hidden" name="alias" value="aliasAlias" class="pageTxt" />
<input id="replaceId_prefix" type="hidden" name="replaceId" value="replaceIdAlias" class="pageTxt" />