(function($, window, document, undefined) {
|
//定义分页类
|
function Paging(element, options) {
|
this.element = element;
|
//传入形参
|
this.options = {
|
pageNo: options.pageNo||1,
|
totalPage: options.totalPage,
|
totalSize:options.totalSize,
|
callback:options.callback
|
};
|
//根据形参初始化分页html和css代码
|
this.init();
|
}
|
//对Paging的实例对象添加公共的属性和方法
|
Paging.prototype = {
|
constructor: Paging,
|
init: function() {
|
this.creatHtml();
|
this.bindEvent();
|
},
|
creatHtml: function() {
|
var me = this;
|
var content = "";
|
var current = me.options.pageNo;
|
var total = me.options.totalPage;
|
var totalNum = me.options.totalSize;
|
//总页数大于4时候
|
if(total > 4) {
|
content += "<a id=\"firstPage\">首页</a>";
|
content +="<a id='prePage'>上一页</a>";
|
if(current==1){
|
content += "<a class='current'>" + 1 + "</a>";
|
content += "<a>" + 2 + "</a>";
|
content += "<a>" + 3 + "</a>";
|
content += ". . .";
|
content += "<a>" + me.options.totalPage + "</a>";
|
}else{
|
if(current<me.options.totalPage){
|
if(current<(me.options.totalPage/2)){
|
content += "<a>" + (current-1) + "</a>";
|
content += "<a class='current'>" + current + "</a>";
|
content += "<a>" + (current+1) + "</a>";
|
content += ". . .";
|
content += "<a>" + me.options.totalPage + "</a>";
|
}
|
else{
|
content += "<a>" + 1 + "</a>";
|
content += ". . .";
|
content += "<a>" + (current-1) + "</a>";
|
content += "<a class='current'>" + current + "</a>";
|
content += "<a>" + (current+1) + "</a>";
|
}
|
|
}else{
|
content += "<a>" + 1 + "</a>";
|
content += ". . .";
|
content += "<a>" + (me.options.totalPage-2) + "</a>";
|
content += "<a>" + (me.options.totalPage-1) + "</a>";
|
content += "<a class='current'>" + me.options.totalPage + "</a>";
|
}
|
}
|
content += "<a id='nextPage'>下一页</a>";
|
content += "<a id=\"lastPage\">尾页</a>";
|
} else {
|
for(var i = 1; i < total + 1; i++) {
|
if(current == i) {
|
content += "<a class='current'>" + i + "</a>";
|
} else {
|
content += "<a>" + i + "</a>";
|
}
|
}
|
}
|
//content += "<span class='totalPages'> 共<span>"+total+"</span>页 </span>";
|
//content += "<span class='totalSize'> 共<span>"+totalNum+"</span>条记录 </span>";
|
me.element.html(content);
|
},
|
//添加页面操作事件
|
bindEvent: function() {
|
var me = this;
|
me.element.off('click', 'a');
|
me.element.on('click', 'a', function() {
|
var num = $(this).html();
|
var id=$(this).attr("id");
|
if(id == "prePage") {
|
if(me.options.pageNo == 1) {
|
me.options.pageNo = 1;
|
} else {
|
me.options.pageNo = +me.options.pageNo - 1;
|
}
|
} else if(id == "nextPage") {
|
if(me.options.pageNo == me.options.totalPage) {
|
me.options.pageNo = me.options.totalPage
|
} else {
|
me.options.pageNo = +me.options.pageNo + 1;
|
}
|
|
} else if(id =="firstPage") {
|
me.options.pageNo = 1;
|
} else if(id =="lastPage") {
|
me.options.pageNo = me.options.totalPage;
|
}else{
|
me.options.pageNo = +num;
|
}
|
me.creatHtml();
|
if(me.options.callback) {
|
me.options.callback(me.options.pageNo);
|
}
|
});
|
}
|
};
|
//通过jQuery对象初始化分页对象
|
$.fn.paging = function(options) {
|
return new Paging($(this), options);
|
}
|
})(jQuery, window, document);
|
