分页中的上页下页中的 1 2 3 4 5 的动态过渡页码 怎么产生的

Question

分页upload

Answer 1

需要一个pagecount这么大的循环来得到这些数字，然后将这些数字提交到业务处理类即可
for（int i=0;i<pagecount;i++）{
     %>
   < a href="#">i</a>
<%
}

Answer 2

 /**
     * 取得显示的页码范围
     * @return
     */
    public List<Integer> getDisplayedPageNoRange()
    {
        LinkedList<Integer> queue = new LinkedList<Integer>();
        for(int i=pageNo-DEFAULT_PAGE_RANGE;i<=this.pageNo+DEFAULT_PAGE_RANGE;i++)
        {
            //假如两边都有且范围已满的情况下, 直接退出
            if((i>=pageNo+DEFAULT_PAGE_RANGE/2 && queue.size()>DEFAULT_PAGE_RANGE)||i>this.getTotalPageCount())
            {
                break;
            }
            if(i>0)
            {
                if(queue.size()>DEFAULT_PAGE_RANGE)
                {
                    queue.poll();
                }
                queue.add(i);
            }
        }
        return queue;
    }

Answer 3

/* Demo Description 想做ajax分页的，来看看吧*/
$(document).ready(function () {
//加载页数及页码
InitPager(155, 1);
});
/*
* Method：初始化分页控件属性
* ｛Parameter1，RecordCount｝:页总数量
* ｛Parameters2，PageIndex｝：当前页索引
*/
function InitPager(RecordCount, PageIndex) {
$("#test").setPager({ RecordCount: RecordCount, PageIndex: PageIndex, PageSize: 10, buttonClick: PageClick });
$("#result").html("您点击的是第" + PageIndex + "页");
};//分页按钮的单击事件
PageClick = function (RecordCount, PageIndex) {
InitPager(RecordCount, PageIndex);
//此处可用PageIndex ，ajax获取json数据，进行显示
/*
$.ajax({
url:location.href,
type:"json",
data:{"parameter1":"value1"},
success:function(d){
}
});
*/
};(function ($) {
//设定页码方法，初始化
$.fn.setPager = function (options) {
var opts = $.extend({}, pagerDefaults, options);
return this.each(function () {
$(this).empty().append(setPagerHtml(parseInt(options.RecordCount), parseInt(options.PageIndex), options.buttonClick)).append("<div class='clear'></div>");
});
}; //设定页数及html
function setPagerHtml(RecordCount, PageIndex, pagerClick) {
var $content = $("<ul class=\"pages\"></ul>");
var startPageIndex = 1;
//若页码超出
if (RecordCount <= 0) RecordCount = pagerDefaults.PageSize;
//末页
var endPageIndex = parseInt(RecordCount % parseInt(pagerDefaults.PageSize)) > 0 ? parseInt(RecordCount / parseInt(pagerDefaults.PageSize)) + 1 : RecordCount / parseInt(pagerDefaults.PageSize);
if (PageIndex > endPageIndex) PageIndex = endPageIndex;
if (PageIndex <= 0) PageIndex = startPageIndex;
var nextPageIndex = PageIndex + 1;
var prevPageIndex = PageIndex - 1;
if (PageIndex == startPageIndex) {
$content.append($("<li><span class=\"beginEnd\">首页</span></li>"));
$content.append($("<li><span class=\"beginEnd\">上一页</span></li>"));
} else {
$content.append(renderButton(RecordCount, 1, pagerClick, "首页"));
$content.append(renderButton(RecordCount, prevPageIndex, pagerClick, "上一页"));
}
//这里判断是否显示页码
if (pagerDefaults.ShowPageNumber) {
//页码部分隐藏 只显示中间区域
if (endPageIndex <= 5 && PageIndex <= 5) {
for (var i = 1; i <= endPageIndex; i++) {
if (i == PageIndex) {
$content.append($("<li><span class=\"current\">" + i + "</span></li>"));
} else {
$content.append(renderButton(RecordCount, i, pagerClick, i));
}
}
} else if (endPageIndex > 5 && endPageIndex - PageIndex <= 2) {
$content.append($("<li class=\"dotted\">...</li>"));
for (var i = endPageIndex - 4; i <= endPageIndex; i++) {
if (i == PageIndex) {
$content.append($("<li><span class=\"current\">" + i + "</span></li>"));
} else {
$content.append(renderButton(RecordCount, i, pagerClick, i));
}
}
} else if (endPageIndex > 5 && PageIndex > 3) {
$content.append($("<li class=\"dotted\">...</li>"));
for (var i = PageIndex - 2; i <= PageIndex + 2; i++) {
if (i == PageIndex) {
$content.append($("<li><span class=\"current\">" + i + "</span></li>"));
} else {
$content.append(renderButton(RecordCount, i, pagerClick, i));
}
}
$content.append($("<li class=\"dotted\">...</li>"));
} else if (endPageIndex > 5 && PageIndex <= 3) {
for (var i = 1; i <= 5; i++) {
if (i == PageIndex) {
$content.append($("<li><span class=\"current\">" + i + "</span></li>"));
} else {
$content.append(renderButton(RecordCount, i, pagerClick, i));
}
}
$content.append($("<li class=\"dotted\">...</li>"));
}
}
if (PageIndex == endPageIndex) {
$content.append($("<li><span class=\"beginEnd\">下一页</span></li>"));
$content.append($("<li><span class=\"beginEnd\">末页</span></li>"));
} else {
$content.append(renderButton(RecordCount, nextPageIndex, pagerClick, "下一页"));
$content.append(renderButton(RecordCount, endPageIndex, pagerClick, "末页"));
$content.append("<input type=\"text\" class=\"text\" /><input type=\"button\" class=\"btn\" value=\"go\" />");
} 

if (pagerDefaults.ShowPageInfo) {
$content.prepend($("<li><label style='font-size:12px; height:20px; line-height:24px;display:block'>第 <span style='color:red; font-size:14px; font-weight:bold'>" + PageIndex + "</span> 页，共" + endPageIndex + "页</label></li>"))
}
return $content;
}

function renderButton(recordCount, goPageIndex, EventHander, text) {
var $goto = $("<li><a title=\"第" + goPageIndex + "页\">" + text + "</a></li>\"");
$goto.click(function () {
EventHander(recordCount, goPageIndex);
});
return $goto;
}

/*分页的默认选项*/
var pagerDefaults = {
DefaultPageCount: 1,
DefaultPageIndex: 1,
PageSize: 20,
ShowPageNumber: true, //是否显示页码
ShowPageInfo: true  //是否显示分页信息{当前第几页，每页几条，共多少页}
};
})(jQuery);/********分页*********/
.ul{padding:0px;margin:0px;}
.pageinfo{padding:10px 0; margin-right:10px}
.pages { float: right; overflow: hidden; font-size: 12px; padding-left: 0px; padding-right: 0px; padding-top: 0px; list-style-type: none; }
.pages LI { padding-bottom: 0px; margin: 0px;  line-height: 12px; white-space: nowrap; float: left; margin-left: 0px;margin-right:5px; _width: 10px; }
.pages .dotted { color: #1f3a87; font-weight: bold; padding-top:4px;}
.pages .beginEnd {line-height: 23px; padding:6px 12px; display: block;  height: 18px;  padding-top: 0px;border: #d7d7d7 1px solid; }
.pages A {color:#23408a;cursor:pointer;  text-decoration: none;  border: #ccc 1px solid; background: #fff; line-height: 23px; padding:6px 12px; display: block;  height: 18px;  padding-top: 0px; }
.pages A:visited { color: #1f3a87; }
.pages A:hover { border:#fcc270 1px solid; background-image:none;color:#ff6500;background-color:#fee0c4; }
.pages .current {border: #d7d7d7 1px solid; background:red; color: #fff;font-weight: bold;  line-height: 23px; padding:6px 12px; display: block;  height: 18px;  padding-top: 0px; }
.pages SPAN { color: #ccc; }
.pages .text{ width:20px; padding:4px 12px;}
.pages .btn{ width:36px; height:28px; margin-left:5px;  border:none; color:#fff; cursor:pointer; background-position:-89px 0}