首页 > Web开发 > 详细

JS分页

时间：2015-06-15 18:43:28 阅读：146 评论：0 收藏：0 [点我收藏+]

标签：

(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) + ‘页  共 ‘ + args.total + ‘ 记录‘);
//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);
/*

.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>


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);//点击页数触发函数
}
});
}
});
}
*/

标签：

原文地址：http://blog.csdn.net/pa5201314/article/details/46506231

踩

(0)

赞

(0)

举报

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行

更多

友情链接

兰亭集智国之画百度统计站长统计阿里云 chrome插件新版天听网

关于我们 - 联系我们 - 留言反馈

© 2014 mamicode.com 版权所有联系我们:gaon5@hotmail.com

迷上了代码！