Files
MeSHard b22d09bd39 init
2025-12-01 11:19:23 +08:00

145 lines
5.9 KiB
JavaScript
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

;(function ($, window, document, undefined) {
'use strict';
function Paging(element, options) {
this.element = element;
this.options = {
nowPage: options.nowPage || 1, // 当前页码
pageNum: options.pageNum, // 总页码
buttonNum: (options.buttonNum>=5?options.buttonNum:5) || 7,// 页面显示页码数量
callback: options.callback // 回调函数
};
this.init();
}
Paging.prototype = {
constructor : Paging,
init : function() {
this.createHtml();
this.bindClickEvent();
this.disabled();
},
createHtml : function(){
var me = this;
var nowPage = this.options.nowPage;
var pageNum = this.options.pageNum;
var buttonNum = this.options.buttonNum;
var content = [];
content.push("<ul>");
content.push("<li class='xl-prevPage'>上一页</li>");
//页面总数小于等于当前要展示页数总数,展示所有页面
if(pageNum <= buttonNum){
for(var i=1; i<=pageNum; i++){
if (nowPage !== i) {
content.push("<li>"+i+"</li>");
} else {
content.push("<li class='xl-active'>"+i+"</li>");
}
}
}else if(nowPage <= Math.floor(buttonNum / 2)){
//当前页面小于等于展示页数总数的一半向下取整从1开始
for(var i=1;i<= buttonNum-2;i++){
if (nowPage !== i) {
content.push("<li>"+i+"</li>");
} else {
content.push("<li class='xl-active'>"+i+"</li>");
}
}
content.push("<li class='xl-disabled'>...</li>");
content.push("<li>" + pageNum + "</li>");
}else if(pageNum - nowPage <= Math.floor(buttonNum / 2)){
//当前页面大于展示页数总数的一半(向下取整)
content.push("<li>"+1+"</li>");
content.push("<li class='xl-disabled'>...</li>");
for(var i=pageNum-buttonNum+3; i<=pageNum; i++){
if (nowPage !== i) {
content.push("<li>"+i+"</li>");
} else {
content.push("<li class='xl-active'>"+i+"</li>");
}
}
}else{
//前半部分页码
if(nowPage - Math.floor(buttonNum / 2) <= 0){
for(var i=1;i<= Math.floor(buttonNum / 2);i++){
if (nowPage !== i) {
content.push("<li>"+i+"</li>");
} else {
content.push("<li class='xl-active'>"+i+"</li>");
}
}
}else{
content.push("<li>"+1+"</li>");
content.push("<li class='xl-disabled'>...</li>");
for(var i=nowPage-Math.floor(buttonNum / 2)+(buttonNum % 2 == 0 ? 3: 2); i<=nowPage; i++){
if (nowPage !== i) {
content.push("<li>"+i+"</li>");
} else {
content.push("<li class='xl-active'>"+i+"</li>");
}
}
}
//后半部分页码
if(pageNum - nowPage <= 0){
for(var i=nowPage+1;i<=pageNum;i++){
content.push("<li>" + i + "</li>");
}
}else{
for(var i=nowPage+1; i<=nowPage+Math.floor(buttonNum / 2)-2; i++){
content.push("<li>"+i+"</li>");
}
content.push("<li class='xl-disabled'>...</li>");
content.push("<li>" + pageNum + "</li>");
}
}
content.push("<li class='xl-nextPage'>下一页</li>");
content.push("</ul>");
me.element.html(content.join(''));
// DOM重新生成后每次调用是否禁用button
setTimeout(function () {
me.disabled();
}, 20);
},
bindClickEvent: function(){
var me = this;
me.element.off('click', 'li');
me.element.on('click', 'li', function () {
var cla = $(this).attr('class');
var num = parseInt($(this).html());
var nowPage = me.options.nowPage;
if( $(this).hasClass('xl-disabled')){
return ;
}
if (cla === 'xl-prevPage') {
if (nowPage !== 1) {
me.options.nowPage -= 1;
}
} else if (cla === 'xl-nextPage') {
if (nowPage !== me.options.pageNum) {
me.options.nowPage += 1;
}
}else {
me.options.nowPage = num;
}
me.createHtml();
if (me.options.callback) {
me.options.callback(me.options.nowPage);
}
});
},
disabled: function () {
var me = this;
var nowPage = me.options.nowPage;
var pageNum = me.options.pageNum;
if (nowPage === 1) {
me.element.children().children('.xl-prevPage').addClass('xl-disabled');
} else if (nowPage === pageNum) {
me.element.children().children('.xl-nextPage').addClass('xl-disabled');
}
}
}
$.fn.paging = function (options) {
return new Paging($(this), options);
}
})(jQuery, window, document);