struts2、jsp分頁代碼

分頁樣式

一上傳這圖片就被打上了水印，暈。

<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<s:if test="#request.count>#request.pageSize">
	<s:set id="len" value="#request.count%#request.pageSize>0?(#request.count/#request.pageSize+1):(#request.count/#request.pageSize)"/>
	<div style="margin:auto;width:400px;overflow: hidden;text-align:center;">
	<div style='height:30px;margin:auto;padding:0px;font-size:15px;color:#277ba0;line-height:30px;float:none;display: inline-block;'>
		<div style='float:left;font-size:15px;color:#277ba0;width:66px;height:30px;line-height:30px;text-align:center;${pageIndex-1>0?"cursor:pointer;":""}'<s:if test="#request.pageIndex-1>0">  onclick='jump(${pageIndex-1},"${param.formid}",${len})'</s:if>>上一頁</div>
		<div style='float:left;width:15px;border-left:1px solid #277ba0;'> </div>
		<div style='text-align:center;float:left;font-size:15px;color:#277ba0;width:30px;cursor:pointer;${(pageIndex==1)?"background:#277ba0;color:white;":""}' onclick='jump(1,"${param.formid}",${len})'>1</div>
		<!-- len 總頁數、 now-->
		<s:if test="#request.pageIndex>3&&#len>5">
			<div style='text-align:center;float: left;width:30px'>...</div>
		</s:if>
		 <s:if test="#request.pageIndex==1">
		 	<s:iterator begin="2" end="4" id="item">
		 		<s:if test="#len>2&&(#item+#request.pageIndex)<=#len">
		 			<div style='text-align:center;float:left;font-size:15px;color:#277ba0;width:30px;cursor:pointer;' onclick='jump(${item},"${param.formid}",${len})'>${item}</div>
		 		</s:if>
		 	</s:iterator>
		 </s:if>
		<s:iterator begin="2" end="#len-1" id="item">
			<s:if test="#item==#request.pageIndex">
				<s:if test="#request.pageIndex==#len-1&&#len>=5">
					<div style='text-align:center;float:left;font-size:15px;color:#277ba0;width:30px;cursor:pointer;' onclick='jump(${item-2},"${param.formid}",${len})'>${item-2}</div> 
				</s:if>
				<s:if test="#item>2">
					<div style='text-align:center;float:left;font-size:15px;color:#277ba0;width:30px;cursor:pointer;' onclick='jump(${item-1},"${param.formid}",${len})'>${item-1}</div>
				</s:if>
				<div style='text-align:center;float:left;font-size:15px;color:#277ba0;width:30px;cursor:pointer;background:#277ba0;color:white;' onclick='jump(${item},"${param.formid}",${len})'>${item}</div>
				<s:if test="#item<#len-1">
					<div style='text-align:center;float:left;font-size:15px;color:#277ba0;width:30px;cursor:pointer;' onclick='jump(${item+1},"${param.formid}",${len})'>${item+1}</div>
				</s:if>
				<s:if test="#request.pageIndex==2&&#item<#len-2">
					<div style='text-align:center;float:left;font-size:15px;color:#277ba0;width:30px;cursor:pointer;' onclick='jump(${item+2},"${param.formid}",${len})'>${item+2}</div>
				</s:if>
			</s:if>
		</s:iterator>		
		<s:if test="#request.pageIndex==#len">
			<s:iterator begin="#len-3" end="#len-1" id="item">
				<s:if test="#len>2&&#item>1">
					<div style='text-align:center;float:left;font-size:15px;color:#277ba0;width:30px;cursor:pointer;' onclick='jump(${item},"${param.formid}",${len})'>${item}</div>
				</s:if>
			</s:iterator>
		</s:if>
		<s:if test="#len>=6&&#request.pageIndex<#len-2">
			<div style='text-align:center;float: left;width:30px;'>...</div>
		</s:if>
		<div style='text-align:center;float:left;font-size:15px;color:#277ba0;width:30px;cursor:pointer;${(pageIndex==len)?"background:#277ba0;color:white;":""}' onclick='jump(${len},"${param.formid}",${len})'>${len}</div>
		<div style='text-align:center;float:left;width:15px;border-right:1px solid #277ba0;'> </div>
		<div style='text-align:center;float:left;font-size:15px;color:#277ba0;width:66px;height:30px;line-height:30px;${len-pageIndex>0?"cursor:pointer;":""}'<s:if test="#len-#request.pageIndex>0"> onclick='jump(${pageIndex+1},"${param.formid}",${len})'</s:if>>下一頁</div>
		
	</div>
	</div>
</s:if>

 

以爲上是pagination.jsp的內容。變量說明：request.count數量總條數、request.pageSize每頁顯示多少條、pageIndex當前頁序號從1開始，裏現還出現了${len}這個變量，仔細看第四行代碼，我是用set來定義的，formid則是調用的jsp傳過來的。js代碼如下：（list.js）

function jump(index,formid,len) {
	var form;//form
	if(formid!=""){
		 form = $("#"+formid);
	}else{
		form = $("form").eq(0);
	}
	index = index || form.find("input[name=pageIndex]").eq(0).val();
	var reg = /^\d+(\.\d+)?$/;
	if (!reg.test(index)||!reg.test(len)) {
		alert("\u9a8c\u8bc1\u5931\u8d25!");
		return;
	}
	var pageindex = parseInt(index);
	var length = parseInt(len);
	
	if (pageindex <= length && pageindex > 0) {
		if(form.find("input[name=pageIndex]").size()<=0){
			var p = $("<input type='hidden' name='pageIndex' value='"+pageindex+"'/>");
			form.append(p);
		}else{
			(form.find("input[name=pageIndex]")[0]).value = pageindex;
		}
		form.submit();
		return true;
	}
}

下面是需要翻頁的jsp調用方式:

<script type="text/javascript" src="list.js"></script>
<form id='form1' method="post">
//你的代碼
</form>
<jsp:include page="pagination.jsp">//加載come.jsp
    <jsp:param name="formid" value="form1" />//傳遞參數
</jsp:include>

你也可以不給form寫id這樣下面jsp:include也不必傳參數過去，默認用第一個form。