java ajax分页插件,java jsp标签分页，jquery 插件分页封装

分页CSS.pagination{

margin: 20px auto 0;

width: 960px;

font-size:12px;

text-align: center;

}

.pagination a{

border:1px solid #CCCCCC;

color: #336CA9;

font-weight: bold;

margin-right: 3px;

padding: 2px 9px;

text-decoration: none;

cursor: pointer;

}

.pagination .all{

font-size: 14px;

margin-right: 10px;

}

.pagination .all b{

margin: 0 5px;

}

.pagination a:hover{

background-color: #1987CD;

color:#FFFFFF;

background-image: none;

}

.pagination .current{

color: #000000;

font-weight: bold;

margin-right: 3px;

padding: 2px 9px;

}

.pagination span.disabled{

border:1px solid #CCCCCC;

color: #336CA9;

font-weight: bold;

margin-right: 3px;

padding: 2px 9px;

}

Java类封装package com.rying.weibo.util;

import java.io.IOException;

import javax.servlet.jsp.JspException;

import javax.servlet.jsp.tagext.TagSupport;

import cn.com.rying.logs.RyingLogs;

public class PageTag extends TagSupport {

private static final long serialVersionUID = 5729832874890369508L;

private String url; // 请求URI

private int pageSize; // 每页要显示的记录数

private int currentPage; // 当前页号

private int pageRecordCount; // 总记录数

@Override

public int doStartTag() throws JspException {

int pageCount = (pageRecordCount + pageSize - 1) / pageSize; // 计算总页数

RyingLogs.infoLogs("url=" + url + "/pageSize=" + pageSize + "/currentPage=" + currentPage + "/count=" + pageRecordCount);

// 拼写要输出到页面的HTML文本

StringBuilder sb = new StringBuilder();

sb.append("\r\n\r\n");

if (pageRecordCount == 0) {

sb.append("没有可显示的数据\r\n");

} else {

// 页号越界处理

if (currentPage > pageCount) {

currentPage = pageCount;

}

if (currentPage 

currentPage = 1;

}

sb.append("\r\n");

// 把当前页号设置成请求参数

sb.append("\r\n");

sb.append("\r\n");

// 输出统计数据

sb.append("共").append(pageCount).append("页");

// 上一页处理

if (currentPage == 1) {

sb.append("首页").append("\r\n").append("上一页").append("\r\n");

} else {

sb.append("首页\r\n");

sb.append("上一页\r\n");

}

// 页面显示最大页码

int maxPage = 10;

int center = maxPage / 2;

int start = 0;

int end = 0;

// 最大页数不超过maxPage

if (pageCount  center) {

// 尾部不够显示，总显示页码数量为maxPage

if (currentPage + center > pageCount) {

start = currentPage - (maxPage - (pageCount - currentPage)) + 1;

end = pageCount;

} else {

// 当前页控制显示为中间值

start = currentPage - center + 1;

end = currentPage + center;

}

} else {

// 当前页码不足最大显示的一半

start = 1;

end = maxPage;

}

}

for (int i = start; i <= end; i++) {

if (currentPage == i) { // 当前页号不需要超链接

sb.append("").append(i).append("\r\n");

} else {

sb.append("").append(i).append("\r\n");

}

}

// 下一页处理

if (currentPage == pageCount) {

sb.append("下一页").append("\r\n");

sb.append("尾页").append("\r\n");

} else {

sb.append("下一页\r\n");

sb.append("尾页\r\n");

}

sb.append("\r\n");

// 生成提交表单的JS

sb.append("\r\n");

}

sb.append("\r\n");

// 把生成的HTML输出到响应中

try {

pageContext.getOut().println(sb.toString());

} catch (IOException e) {

throw new JspException(e);

}

return SKIP_BODY; // 本标签主体为空,所以直接跳过主体

}

public void setUrl(String url) {

this.url = url;

}

public void setpageSize(int pageSize) {

this.pageSize = pageSize;

}

public void setcurrentPage(int currentPage) {

this.currentPage = currentPage;

}

public void setpageRecordCount(int pageRecordCount) {

this.pageRecordCount = pageRecordCount;

}

}

pagetld0.9

p

page

com.rying.weibo.util.PageTag

empty

currentPage

true

true

int

pageRecordCount

true

true

int

pageSize

true

true

int

url

true

true

java.lang.String

页面使用

头部引入

jquery ajax分页封装/**

* jquery.pagination.js

*

* Author:Irwin.Ai

*

* Date: 2013-04-07

*/

(function($){

$.fn.pagination = function(options){

var opts = $.extend({}, $.fn.pagination.defaults, options);

return this.each(function(){

var $this = $(this);

/**

*计算总页数

*/

function calculatePages(data){

return ((data.total % opts.pageSize) == 0) ?  Math.floor(data.total / opts.pageSize) : (Math.floor(data.total / opts.pageSize) + 1);

}

/**

*计算开始结束页码

*/

function getInterval(data){

// 页面显示最大页码

var maxPage = 10;

var center = maxPage / 2;

var start = 0;

var end = 0;

var pageCount = calculatePages(data);

// 最大页数不超过maxPage

if (pageCount  center) {

// 尾部不够显示，总显示页码数量为maxPage

if (opts.currentPage + center > pageCount) {

start = opts.currentPage - (maxPage - (pageCount - opts.currentPage)) + 1;

end = pageCount;

} else {

// 当前页控制显示为中间值

start = opts.currentPage - center + 1;

end = opts.currentPage + center;

}

} else {

// 当前页码不足最大显示的一半

start = 1;

end = maxPage;

}

}

return [start,end];

}

/**

*选择页码，翻页

*/

function selectPage(page){

opts.currentPage = page;

draw();

}

/**

*填充显示链接html

*/

function draw(){

if(opts.ajax.url != null) {

var transData = ((opts.ajax.data == null) ? (new Object()) : opts.ajax.data);

transData.pageSize = opts.pageSize;

transData.currentPage = opts.currentPage;

$.ajax({

url : opts.ajax.url,

data : transData,

dataType : opts.ajax.dataType,

success : function(data){

opts.ajax.callback(data);

if(data == null || data == ""){

return;

}

if(data.total == undefined){

return;

}else{

//清空

$this.empty();

if(data.total == 0){

return;

}else{

//获取页码

var pageCount = calculatePages(data);

var interval = getInterval(data);

// 页号越界处理

if (opts.currentPage > opts.pageCount) {

opts.currentPage = pageCount;

}

if (opts.currentPage 

copts.currentPage = 1;

}

$this.append('共' + pageCount + '页');

if(opts.currentPage == 1){

$this.append('首页上一页');

} else {

$this.append('首页上一页');

}

for(var i = interval[0]; i <= interval[1]; i++){

if(opts.currentPage == i){

$this.append('' + i + '');

} else {

$this.append('' + i + '');

}

}

if(opts.currentPage == pageCount){

$this.append('下一页尾页');

} else {

$this.append('下一页尾页');

}

$(".first").bind("click",function(){

selectPage(1);

});

$(".end").bind("click",function(){

selectPage(calculatePages(data));

});

$(".pre").bind("click",function(){

selectPage(parseInt(opts.currentPage) - 1);

});

$(".next").bind("click",function(){

selectPage(parseInt(opts.currentPage) + 1);

});

$(".cur").bind("click", function(){

selectPage($(this).text());

});

}

}

}

});

}

}

draw();

});

};

$.fn.pagination.defaults = {

ajax : {

url : null, //url地址

data : null, // 数据，必须是对象

dataType : 'json', //数据类型

type : 'get', //提交类型

callback : function(){} //成功回调函数

},

pageSize : 5, //每页显示数量

currentPage : 1 //当前页

};

})(jQuery);

jquery调用$(".pagination").pagination({

ajax : {

url : 'search.action',

dataType : 'json',

data : {"search":"test"},

callback : function(data){

//do something

}

},

pageSize : 5

});

页面效果