効果:
html:
次のようにコードをコピーします。
<div id="ページ"></div>
使用法:
次のようにコードをコピーします。
var 合計 = 310;
var ページ番号 = 1;
var pageCount = 31;//合計ページは何ページありますか?
var pageSize = 10;
var actionName = "リスト.アクション";
var otherParam = "&name='www'&order='time'";
$(関数(){
paginate();//ページネーション}
);
css:
次のようにコードをコピーします。
#ページ{
フォントサイズ: 14px;
クリア:両方。
パディングトップ: 1.45em;
ホワイトスペース: ナラップ;
}
#ページa{
背景: 白;
ボーダー: 1px ソリッド #E7ECF0;
表示: インラインブロック;
高さ: 22ピクセル;
行の高さ: 22px;
マージン右: 5px;
テキスト整列: 中央;
テキスト装飾: なし。
垂直配置: 中央;
幅: 23px;
}
#pagePre,#pageNext{
}
.page現在{
フォントの太さ: 太字;
}
js:
次のようにコードをコピーします。
関数 mcPaginate(){
var $pageDiv = $("#page");
アクション名 = アクション名 + "?pageSize="+pageSize;
if(otherParam のタイプ != '未定義' && otherParam != ""){
アクション名 = アクション名 + otherParam;
}
$pageDiv.append("ページ"+ページ番号+"/合計"+ページ数+"ページ");
//前のページ
if(ページ番号 > 1){
var hf = アクション名 + "&pageNo="+(pageNo-1);
$pageDiv.append("<a href='"+hf+"' style='width: 65px;'>"+"前のページ"+"</a>");
};
if(pageCount <= pageSize){
for(var i=0; i < pageCount; i++){
var hf = アクション名 + "&pageNo="+(i+1);
if(pageNo == (i+1)){//現在のページ
$pageDiv.append("<a href='"+hf+"' class='pageCurrent'>"+pageNo+"</a>");
}それ以外{
$pageDiv.append("<a href='"+hf+">"+(i+1)+"</a>");
};
};
}それ以外{
for(var i=0; i < pageSize; i++){
varmidIndex = 0;
if(pageSize%2 == 0){
midIndex = ページサイズ/2 - 1;
}それ以外{
midIndex = ページサイズ/2;
}
var num = -midIndex;
var showPageNum = ページ番号 + i+ 番号;
if(showPageNum > 0 && showPageNum <= pageCount){
var hf = アクション名 + "&pageNo="+showPageNum;
if(pageNo == showPageNum){//現在のページ
$pageDiv.append("<a href='"+hf+"' class='pageCurrent'>"+showPageNum+"</a>");
}それ以外{
$pageDiv.append("<a href='"+hf+">"+showPageNum+"</a>");
};
};
};
}
//次のページ
if(ページ番号 < ページ数){
var hf = アクション名 + "&pageNo="+(pageNo+1);
$pageDiv.append("<a href='"+hf+"' style='width: 65px;'>"+"次のページ"+"</a>");
};
$pageDiv.append("「+」に移動<input type='text' class='goNum' style='width:30px;' name='goNum'>page<input type='button' name='goButton' class='goButton' value='OK'>");
$(".goButton").click(function(){
var goNum = $(".goNum").val();
if(goNum!=""){
window.location.href = アクション名 + "&pageNo="+goNum;
}
});
};