刷新保留ajax页码,页码js，支持ajax无刷新翻页-CSDN博客

这篇博客分享了一个使用JavaScript（JQuery）实现的Ajax无刷新分页栏的代码示例，允许用户在不刷新页面的情况下进行页面切换。代码中包含了分页栏的初始化配置、事件处理和样式设置，适用于前端网页的动态加载需求。

摘要由CSDN通过智能技术生成

前阵子工作需要做一个支持ajax无刷新翻页的页码控件，在网上找了别人的例子修改的~(里面class神马的懒得去改了，直接简单写了下)下载链接~

引入一个js文件

/**************************/

//JQuery分页栏

/**************************/

$.fn.pageBar = function(options) {

var configs = {

PageIndex: 1,

PageSize: 15,

TotalPage: 0,

RecordCount: 0,

showPageCount: 4,

onPageClick: function(pageIndex) {

return false; //默认的翻页事件

}

$.extend(configs, options);

var tmp = "",

i = 0,

j = 0,

a = 0,

b = 0,

totalpage = parseInt(configs.RecordCount / configs.PageSize);

totalpage = configs.RecordCount % configs.PageSize > 0 ? totalpage + 1 : totalpage;

tmp += "

找到" + configs.RecordCount + "条结果";

tmp += "

if (configs.PageIndex > 1) {

tmp += "上一页";

} else {

tmp += "";

}

tmp += "1";

if (totalpage > configs.showPageCount + 1) {

if (configs.PageIndex <= configs.showPageCount) {

i = 2;

j = i + configs.showPageCount;

a = 1;

} else if (configs.PageIndex > totalpage - configs.showPageCount) {

i = totalpage - configs.showPageCount;

j = totalpage;

b = 1;

} else {

var k = parseInt((configs.showPageCount - 1) / 2);

i = configs.PageIndex - k;

j = configs.PageIndex + k + 1;

a = 1;

b = 1;

if ((configs.showPageCount - 1) % 2) {

i -= 1

}

else {

i = 2;

j = totalpage;

}

if (b) {

tmp += "...";

}

for (; i < j; i++) {

tmp += "" + i + "";

}

if (a) {

tmp += " ... ";

}

if (totalpage > 1) {

tmp += "" + totalpage + "";

}

if (configs.PageIndex < totalpage) {

tmp += "下一页";

} else {

tmp += "";

}

tmp += "到第Go";

tmp += "";

tmp += "页";

tmp += "确定";

tmp += "";

var pager = this.html(tmp)

var index = pager.children().children('input')[0]

pager.children().children('a').click(function() {

var cls = $(this).attr('class');

var page = $(this).text();

if ( page == '上一页') {

configs.onPageClick(configs.PageIndex - 2)

} else if (page == '下一页') {

configs.onPageClick(configs.PageIndex)

} else if (page == '确定') {

if (!isNaN(index.value)) {

var indexvalue = parseInt(index.value);

indexvalue = indexvalue < 1 ? 1 : indexvalue

indexvalue = indexvalue > totalpage ? totalpage : indexvalue

configs.onPageClick(indexvalue - 1)

}

} else {

if (cls != 'g-btn-cur') {

configs.onPageClick(parseInt(page) - 1)

}

}).each(function() {

var page = $(this).text();

configs.PageIndex == parseInt(page) && $(this).addClass('g-btn-cur');

/*if (configs.PageIndex == parseInt(page)) {

$(this).addClass('g-btn-cur')

} */

})

}