当前位置: 代码迷 >> Web前端 >> 页面作分页
  详细解决方案

页面作分页

热度:215   发布时间:2012-06-30 17:20:12.0
页面做分页
/**
 * 跳转
 * 
 * @param 跳转的页号
 */
function jumpPage(pageNo) {
	$("#pageNo").val(pageNo);
	$("#listForm").submit();
}

  //输入页码然后跳转
    function goPage(){
    	if($("#goPageNo").val()>=1){
    		if($("#goPageNo").val()<=$("#totalPage").val()){
    			jumpPage($("#goPageNo").val());
    		}else{
        		jumpPage($("#totalPage").val());
        	}
    	}else{
    		jumpPage(1);
    	}
    }

//隐藏参数
  <input type="hidden" name="pageNo" id="pageNo" value="${pageData.pagination.pageNo}" />
 <input type="hidden" name="fieldName" id="fieldName" value="${pageData.compositor.fieldName}" />
<input type="hidden" name="compositorType" id="compositorType" value="${pageData.compositor.compositorType}" />
 <input type="hidden" name="totalPage" id="totalPage" value="${pageData.pagination.totalPage}" />

//具体分页
<div class="pagination"> 
      <a href="javascript:jumpPage(1)" title="First Page">? 首页</a>
      <c:if test="${pageData.pagination.hasPrevPage}">  <a href="javascript:jumpPage(${pageData.pagination.prevPage})">? 上一页</a> </c:if>
      <c:if test="${pageData.pagination.pageNo<=pageData.pagination.totalPage}">
      <a href="javascript:jumpPage(${pageData.pagination.pageNo})" class="number current" title="${pageData.pagination.pageNo}">${pageData.pagination.pageNo}</a>
      </c:if>
      <c:if test="${pageData.pagination.pageNo+1<=pageData.pagination.totalPage}">
       <a href="javascript:jumpPage(${pageData.pagination.pageNo+1})" class="number" title="${pageData.pagination.pageNo+1}">${pageData.pagination.pageNo+1}</a> 
      </c:if>
      <c:if test="${pageData.pagination.pageNo+2<=pageData.pagination.totalPage}">
       <a href="javascript:jumpPage(${pageData.pagination.pageNo+2})" class="number" title="${pageData.pagination.pageNo+2}">${pageData.pagination.pageNo+2}</a> 
     </c:if>
     <c:if test="${pageData.pagination.pageNo+3<=pageData.pagination.totalPage}">
      <a href="javascript:jumpPage(${pageData.pagination.pageNo+3})" class="number" title="${pageData.pagination.pageNo+3}">${pageData.pagination.pageNo+3}</a> 
     </c:if>
      <c:if test="${pageData.pagination.hasNextPage}"><a href="javascript:jumpPage(${pageData.pagination.nextPage})" title="Next Page">下一页 ?</a> </c:if>
       <a href="javascript:jumpPage(${pageData.pagination.totalPage})"> 尾页?</a> 总记录数 <i class="color_red">${pageData.pagination.totalCount}</i> 条
        <input type="text" id="goPageNo" name="goPageNo" value="" class="page">
        /${pageData.pagination.totalPage}
        <input type="reset" value="GO" onclick="javascript:goPage();" class="btn btn_gray go">
      </div>
    </div>
  </div>

  相关解决方案