java web 一个好用的前台分页技术

首先将分页用到的js，css引进来

再在要使用分页的页面的JS代码中加入：

var allQuestionPage = 1;
var noAnswerQuestionPage = 1;
$(function(){
    
    //获取所有问题共有几页
    getAllQuestionPage();
    //获取待回答问题共有几页
    getNoAnswerQuestionPage();
    
    //$('#paginnator').load('../../paginnator/test.html');
     pageNav.pre="上一页";
     pageNav.next="下一页";
     pageNav1.pre="上一页";
     pageNav1.next="下一页";
     pageNav.fn = function(p,pn){
      getAjax(p);
        };        
     pageNav1.fn = function(p,pn){
         getNoAnswerQuestionList(p);
            };
       
      
       var message = "${message}";
       if(null!=message && ""!=message){
           //alert(message);
       }
  
    
    
    
})
//获取未回答问题列表
function getNoAnswerQuestionList(currentPage){
     $.ajax({
         type:"get",
         url:"webSQuestionInfoAction_getNoAnswerQuestionList.do",
         dataType:"text",
         data:"currentPage="+currentPage+"&time="+new Date().getTime(),
         success: function(data){
              $("#content2").html(data);            
         },
         error:function(){
             alert("error");
         }
 });    
    
}

//获取问题列表
function getAjax(currentPage){
      $.ajax({
             type:"get",
             url:"webSQuestionInfoAction_getQuestionList.do",
             dataType:"text",
             data:"currentPage="+currentPage+"&time="+new Date().getTime(),
             success: function(data){
                  $("#content").html(data);           
             },
             error:function(){
                 alert("error");
             }
     });    
}


//获取所有问题共有几页
function getAllQuestionPage(){
    $.ajax({
         type:"get",
         url:"webSQuestionInfoAction_getAllQuestionPage.do",
         dataType:"text",
         success: function(data){
            allQuestionPage = data;        
            pageNav.go(1,allQuestionPage);
         },
         error:function(){
             alert("error");
         }
});    
    
    
}

//获取待回答问题共有几页
function getNoAnswerQuestionPage(){
    
    $.ajax({
         type:"get",
         url:"webSQuestionInfoAction_getNoAnswerQuestionPage.do",
         dataType:"text",
         success: function(data){
            noAnswerQuestionPage = data;
             pageNav1.go(1,noAnswerQuestionPage);
         },
         error:function(){
             alert("error");
         }
});    
    
}

后台代码：

String currentPage = request.getParameter("currentPage");
String org = request.getParameter("org");
System.out.println(currentPage+"   "+org);
List questionList =sQuestionInfoBiz.getQuestionList(Integer.parseInt(currentPage), pageUtil.getPageSize());
request.setAttribute("questionList", questionList);
return "list";

这里的list是返回至另一个循环list的页面，所以要新建一个页面用来循环list,然后ajax将它包括进自己的页面，这里就是遍历list的页面

这里提供一个下载该分页的JS地址：点击打开链接