这个ajax分页是基本jquery来实现的，足以满足正常需求。。。

效果：

HTML：

CSS：

.zh-page{height: 20px;padding: 20px 0;text-align: right;}

.zh-page ul{display: inline-block;height: 20px;}

.zh-page ul li{float: left;height: 20px;line-height: 20px;margin: 0 3px;color: #fff;font-size: 14px;}

.zh-page ul li a{display: block;height: 100%;min-width: 10px;border-radius: 10px;padding: 0 5px;color: #fff;}

.zh-page ul .zh-cur a{background-color: #4DDDF2;color: #1c1c1c;}

.zh-page .zh-icon-prev,

.zh-page .zh-icon-next{display: inline-block;width: 0;height: 0;border-style: solid;border-width: 4px 6px;border-color: transparent #858587 transparent transparent;}

.zh-page .zh-icon-next{border-color: transparent transparent transparent #858587;}

JS：

$.extend({

// ajax分页

page: function(options) {

var defaults = {

'visiblePages': 6 // 可见页码(不能小于4)

};

var opts = $.extend({}, defaults, options);

var curPage = opts.curPage;

// 创建分页列表

function createPageList(curPage) {

var li = '

';

if(opts.totalPages <= opts.visiblePages) { // 总页数<=可见页

for(var i=1; i<=opts.totalPages; i++) {

if(curPage == i) {

li += '

'+i+'';

} else {

li += '

'+i+'';

}

}

} else { // 总页数>可见页

if(curPage < opts.visiblePages-1) { // 当前页

for(var i=1; i<=opts.visiblePages-1; i++) {

if(curPage == i) {

li += '

'+i+'';

} else {

li += '

'+i+'';

}

}

li += '

...';

li += '

'+opts.totalPages+'';

} else if(curPage >= opts.visiblePages-1) { // 当前页>=可见页-1

if(opts.totalPages-curPage <= opts.visiblePages-4) { // 能连到结束

li += '

1';

li += '

...';

for(var i=opts.totalPages-(opts.visiblePages-2); i<=opts.totalPages; i++) {

if(curPage == i) {

li += '

'+i+'';

} else {

li += '

'+i+'';

}

}

} else { // 不能连到结束

li += '

1';

li += '

...';

for(var i=curPage-(opts.visiblePages-4); i<=curPage+1; i++) {

if(curPage == i) {

li += '

'+i+'';

} else {

li += '

'+i+'';

}

}

li += '

...';

li += '

'+opts.totalPages+'';

}

}

}

li += '

';

li += '

共'+opts.totalPages+'页';

$(opts.ele).html(li);

}

createPageList(curPage);

// 点击页码

$(opts.ele).off('click');

$(opts.ele).on('click', 'li:not(.zh-prev, .zh-next, .zh-total, .zh-ellipsis)', function() {

curPage = +$(this).text();

$(this).addClass('zh-cur').siblings().removeClass('zh-cur');

createPageList(curPage);

if(opts.change && typeof opts.change === 'function') {

opts.change.call(null, curPage);

}

});

// 点击前一页

$(opts.ele).on('click', '.zh-prev', function() {

curPage = +$(opts.ele).children('.zh-cur').text();

curPage--;

if(curPage < 1) return;

createPageList(curPage);

if(opts.change && typeof opts.change === 'function') {

opts.change.call(null, curPage);

}

});

// 点击后一页

$(opts.ele).on('click', '.zh-next', function() {

curPage = +$(opts.ele).children('.zh-cur').text();

curPage++;

if(curPage > opts.totalPages) return;

createPageList(curPage);

if(opts.change && typeof opts.change === 'function') {

opts.change.call(null, curPage);

}

});

}

});

调用：

$.page({

ele: '.zh-page ul',

curPage: 1, // 当前页

visiblePages: 5, // 可见页码

change: function(num) { // 回调

// alert(num);

},

totalPages: 20 // 总页数

});