黑夜的狼

沮丧吗,那就是一种无病呻吟!留恋它就是一种高度近视!目光应该放得更远一点! 别不想飞,只是要一步跨过太平洋!

  博客园 :: 首页 :: 博问 :: 闪存 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理 ::

 

因为easyui的分页条比较死板,所以只能自己写个简单的,不过够用

(function ($)
{
var settings = {
PrevText: "Prev",
NextText: "Next",
PageSize: 10,
RecordCount: 0,
CurrentIndex: 1,
ShowIndexNum: 5, //页码最大数
FrameCSS: "next",
IndexCSS: "next02",
CurrrentIndexCSS: "next03",
ChangePage: null //换页后回调
};
var methods = {
init: function (options)
{
$.extend(settings, options);
var frame = $("<div class='" + settings.FrameCSS + "'></div>");
//var frame = $("<ul></ul>");
//divFrame.append(frame);
frame.append("<li index='prev'><a href='javascript:void(0)'>" + settings.PrevText + "</a></li>");

var PageNum = Math.ceil(settings.RecordCount / settings.PageSize);
var showIndexNum = PageNum > settings.ShowIndexNum ? settings.ShowIndexNum : PageNum;
for (var i = 1; i <= showIndexNum; i++)
{
if (i == settings.CurrentIndex)
{
frame.append("<li type='index' index='" + i + "' class='" + settings.CurrrentIndexCSS + "'><a onfocus=\"this.blur()\" href='javascript:void(0)'>" + i + "</a></li>");
}
else
{
frame.append("<li type='index' index='" + i + "' class='" + settings.IndexCSS + "'><a onfocus=\"this.blur()\" href='javascript:void(0)'>" + i + "</a></li>");
}
}
frame.append("<li index='next'><a href='javascript:void(0)'>" + settings.NextText + "</a></li>");

this.append(frame);
frame.children("li").bind("mousedown", methods.ChangeIndex);
/*
<div class="next" style="margin-left:450px;">
<ul>
<li><a href="#">Previous</a></li>
<li class="next02"><a href="#">1</a></li>
<li class="next02"><a href="#">2</a></li>
<li><a href="#">...</a></li>
<li class="next02"><a href="#">15</a></li>
<li><a href="#">Next</a></li>
</ul>
</div>
*/
},
ChangeIndex: function ()
{
var $this = $(this);
var indexStr = $this.attr("index");
var index;
var TotalPage = Math.ceil(settings.RecordCount / settings.PageSize);
switch (indexStr)
{
case "prev":
index = settings.CurrentIndex - 1 < 1 ? 1 : settings.CurrentIndex - 1;
break;
case "next":
index = settings.CurrentIndex + 1 > TotalPage ? TotalPage : settings.CurrentIndex + 1;
break;
default:
index = parseInt(indexStr);
break;
}

$this.siblings("li[index='" + settings.CurrentIndex + "']").removeClass(settings.CurrrentIndexCSS).addClass(settings.IndexCSS);
if (TotalPage > settings.ShowIndexNum)
{
if (TotalPage - index <= parseInt(settings.ShowIndexNum / 2))
{
$this.parent().children("li[type='index']").each(function (i)
{
var $lThis = $(this);
$lThis.attr({ "index": (TotalPage - settings.ShowIndexNum + 1 + i) });
$lThis.children().text((TotalPage - settings.ShowIndexNum + 1 + i));
});
}
else if (index <= Math.ceil(settings.ShowIndexNum / 2))
{
var a = $this.siblings();
var b = $this.siblings("li[type='index']");
$this.parent().children("li[type='index']").each(function (i)
{
var $lThis = $(this);
$lThis.attr({ "index": (1 + i) });
$lThis.children().text((1 + i));
});
}
else
{
$this.parent().children("li[type='index']").each(function (i)
{
var $lThis = $(this);
$lThis.attr({ "index": (1 + i + index - Math.ceil(settings.ShowIndexNum / 2)) });
$lThis.children().text((1 + i + index - Math.ceil(settings.ShowIndexNum / 2)));
});
}
}
$this.parent().children("li[type='index'][index='"+index+"']").removeClass(settings.IndexCSS).addClass(settings.CurrrentIndexCSS);
settings.CurrentIndex = index;
if (settings.ChangePage != null)
{
settings.ChangePage(settings.CurrentIndex);
}
}
};
$.fn.PageBar = function (method)
{
if (this.length == 0) return;
if (methods[method])
{
return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
}
else if (typeof method === 'object' || !method)
{
return methods.init.apply(this, arguments);
}
else { $.error('Method ' + method + ' does not exist on jQuery.PageBar'); }
};
})(jQuery);
.next{
width
:300px;
}
.next li
{
float
:left;
margin-left
:15px;
margin-top
:25px;
}
.next li a
{
font-size
:14px;
}
.next02
{
margin
:0;
padding
:0;
}
.next02 a
{
padding
:5px;
}
.next02 a:hover
{
padding
:5px;
background-color
:#ded6c0;
color
:#FFF;
}
.next03
{
margin
:0;
padding
:0;
}
.next03 a
{
padding
:5px;
background-color
:#ded6c0;
color
:#FFF;
}


 

posted on 2011-11-17 02:14  anncesky  阅读(280)  评论(0)    收藏  举报