(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);" class="firsPage">首页</a>');
obj.append('<a href="javascript:void(0);" class="prevPage">上一页</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);" class="lastPage">末页</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);
}
});
// 首页
obj.one("click", "a.firsPage",
function() {
var current = 1;
ms.fillHtml(obj, {
"current" : current,
"pageCount" : parseInt(args.pageCount)
});
if (typeof (args.backFn) == "function") {
args.backFn(current);
}
});
// 末页
obj.one("click", "a.lastPage",
function() {
var current = parseInt(args.pageCount);
ms.fillHtml(obj, {
"current" : current,
"pageCount" : parseInt(args.pageCount)
});
if (typeof (args.backFn) == "function") {
args.backFn(current);
}
});
})();
}
}
$.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);//点击页数触发函数
}
});
}
});
}
*/
js分页
最新推荐文章于 2024-05-09 08:24:21 发布