JS分页

(function($){
var ms = {
init:function(obj,args){
return (function(){
ms.fillHtml(obj,args);
ms.bindEvent(obj,args);
})();
},
//填充html
fillHtml:function(obj,args){
return (function(){
obj.empty();
//obj.append('<div class="page_title">');
//obj.append('第' + parseInt(args.current)+'/'+parseInt(args.pageCount) + '页&nbsp;&nbsp;共&nbsp;' + args.total + '&nbsp;记录');
//obj.append('</div>');
if(args.pageCount > 0){
if(parseInt(args.current) == 1){
obj.append('<a href="javascript:void(0)">首页</a>');
obj.append('<a href="javascript:void(0)">上一页</a>');
}
if(parseInt(args.current) >= 2){
obj.append('<a href="javascript:void(0);">首页</a>');
obj.append('<a href="javascript:void(0);" class="prevPage">上一页</a>');
}
/*
if(parseInt(args.current) == 1){
obj.append('<span class="current">1</span>');
if(parseInt(args.pageCount) >= 2){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 1) + '</a>');
}
if(parseInt(args.pageCount) >= 3){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 2) + '</a>');
}
if(parseInt(args.pageCount) >= 4){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 3) + '</a>');
}
if(parseInt(args.pageCount) >= 5){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 4) + '</a>');
}
}
if(parseInt(args.current) == 2){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 1) + '</a>');
if(parseInt(args.pageCount) >= 2){
obj.append('<span class="current">2</span>');
}
if(parseInt(args.pageCount) >= 3){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 1) + '</a>');
}
if(parseInt(args.pageCount) >= 4){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 2) + '</a>');
}
if(parseInt(args.pageCount) >= 5){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 3) + '</a>');
}
}
*/
if(parseInt(args.current) < 5){//当多于两个时交给下一个循环
for(var i = 1;i <= 7; i++){
if(parseInt(args.current) == i){//当前页显示
obj.append('<span class="current">' + i + '</span>');
}else if(parseInt(args.pageCount) >= i){//可递增页显示
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + i + '</a>');
}else{
break;
}
}
}

if(parseInt(args.current) >=5 && parseInt(args.current) <= (parseInt(args.pageCount)-4)){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 3) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 2) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 1) + '</a>');
obj.append('<span class="current">' + parseInt(args.current) + '</span>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 1) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 2) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 3) + '</a>');
}


//做减法防止页数小于0
if(parseInt(args.current) >= 5 && parseInt(args.current) > (parseInt(args.pageCount)-4)){
if(parseInt(args.current) == parseInt(args.pageCount)){
if(parseInt(args.current) > 6){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 6) + '</a>');
}
if(parseInt(args.current) > 5){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 5) + '</a>');
}
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 4) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 3) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 2) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 1) + '</a>');
obj.append('<span class="current">' + parseInt(args.current) + '</span>');
}
if(parseInt(args.current) == parseInt(args.pageCount)-1){
if(parseInt(args.current) > 5){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 5) + '</a>');
}
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 4) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 3) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 2) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 1) + '</a>');
obj.append('<span class="current">' + parseInt(args.current) + '</span>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 1) + '</a>');
}
if(parseInt(args.current) == parseInt(args.pageCount)-2){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 4) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 3) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 2) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 1) + '</a>');
obj.append('<span class="current">' + parseInt(args.current) + '</span>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 1) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 2) + '</a>');
}
if(parseInt(args.current) == parseInt(args.pageCount)-3){
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 3) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 2) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) - 1) + '</a>');
obj.append('<span class="current">' + parseInt(args.current) + '</span>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 1) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 2) + '</a>');
obj.append('<a href="javascript:void(0);" class="tcdNumber">' + (parseInt(args.current) + 3) + '</a>');
}
}

if(parseInt(args.current) < parseInt(args.pageCount)){
obj.append('<a href="javascript:void(0);" class="nextPage">下一页</a>');
obj.append('<a href="javascript:void(0);">末页</a>');
}
if(args.current == args.pageCount){
obj.append('<a href="javascript:void(0)">下一页</a>');
obj.append('<a href="javascript:void(0)">末页</a>');
}
}
})();
},
//绑定事件
bindEvent:function(obj,args){
return (function(){
obj.one("click","a.tcdNumber",function(){
var current = parseInt($(this).text());
ms.fillHtml(obj,{"current":current,"pageCount":parseInt(args.pageCount)});
if(typeof(args.backFn)=="function"){
args.backFn(current);
}
});
//上一页
obj.one("click","a.prevPage",function(){
var current = parseInt(obj.children("span.current").text());
ms.fillHtml(obj,{"current":current-1,"pageCount":parseInt(args.pageCount)});
if(typeof(args.backFn)=="function"){
args.backFn(current-1);
}
});
//下一页
obj.one("click","a.nextPage",function(){
var current = parseInt(obj.children("span.current").text());
ms.fillHtml(obj,{"current":current+1,"pageCount":parseInt(args.pageCount)});
if(typeof(args.backFn)=="function"){
args.backFn(current+1);
}
});
})();
}
}
$.fn.createPage = function(options){
var args = $.extend({
pageCount : 10,
current : 1,
total : 0,
backFn : function(){}
},options);
ms.init(this,args);
}
})(jQuery);
/*
<!-- CSS显示 -->
.tcdPageCode{color: #ccc;text-align:center;}
.tcdPageCode a{display: inline-block;color: #666;display: inline-block;height: 25px;line-height: 25px; padding: 0 10px;border: 1px solid #ddd; margin: 0 2px;border-radius: 4px;vertical-align: middle;}
.tcdPageCode a:hover{text-decoration: none;border: 1px solid #FD6596;}
.tcdPageCode span.current{display: inline-block;height: 25px;line-height: 25px;padding: 0 10px;margin: 0 2px;color: #fff;background-color: #FD6596; border: 1px solid #FD6596;border-radius: 4px;vertical-align: middle;}
.tcdPageCode span.disabled{ display: inline-block;height: 25px;line-height: 25px;padding: 0 10px;margin: 0 2px; color: #bfbfbf;background: #f2f2f2;border: 1px solid #bfbfbf;border-radius: 4px;vertical-align: middle;}


<!-- 分页数据展示 -->
<div id="tcdPageCode">
<div class="tcdPageCode"></div>
</div>


<!-- 调用JS函数 -->
  function showList(obj,page) {
$.ajax({
type: "post",
url: smvc+"/goods/img.html?pid="+obj+"&page="+page,
dataType: "json",
success: function(data){
var arr = [];
var rows = data["rows"];
for(var row in rows){
arr.push('<div class="image">');
arr.push('<div class="scope">');
arr.push('<img src="'+rows[row].url+'"/>');
arr.push('</div>');
arr.push('</div>');
}
$("#imgList").html(arr.join(""));

//重构分页视图(因为数据记录是动态的,每一次请求页数和总记录数都有可能变化)
$("#tcdPageCode").html($("#tcdPageCode").html());//消除多次实例化后的对象事件
$(".tcdPageCode").createPage({
       pageCount:data["pageCount"],//总页数
       current:data["currentPage"],//当前页
       total:data["total"],//总记录数
       backFn:function(p){
        showList(obj,p);//点击页数触发函数
       }
   });
}
});
}
 */