ajax实现的分页代码(二)

jsp页面的实现
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<base href="<%=basePath%>">
		<title>My JSP 'TestJson.jsp' starting page</title>
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<meta http-equiv="expires" content="0">
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="This is my page">
		<script type="text/javascript" src="js/prototype.js"></script>
		<script type="text/javascript" src="js/Page.js"></script>
		<script type="text/javascript">	    
		function gotoPage(id){	    
		  var url = 'testJson.do';  
		  var pars = 'page='+id;	  		
		  new Ajax.Request( url, 
		                  { method: 'get', 
		                  parameters: pars, 
		                  onComplete: showResponse 
		                  }
		                  );
	  }	
    	var myGlobalHandlers = {
			onCreate: function(){
				Element.show('systemWorking');
			},
	
			onComplete: function() {
				if(Ajax.activeRequestCount == 0){
					Element.hide('systemWorking');
				}
			}
		};
		Ajax.Responders.register(myGlobalHandlers);
	  function shows(){	    
		  var url = 'testJson.do';  
		  var pars = '';	  		
		  new Ajax.Request( url, 
		                  { method: 'get', 
		                  parameters: pars, 
		                  onComplete: showResponse 
		                  }
		                  );
	  }	
		function showResponse(originalRequest)	{	   
		   jsonRaw = originalRequest.responseText;	   
		   jsonContent = eval("(" + jsonRaw + ")");
		   var cP=jsonContent.cP;
		   var tP=jsonContent.tP;
		   var tN=jsonContent.tN;
		   showPages(cP,tP,tN);	   
		   finalResponse = "<b>" + jsonContent.dw.length + " matches found in range</b><br/>";	  
		   for (i = 0; i < jsonContent.dw.length; i++) {
		        finalResponse += "<hr/>";
		        finalResponse += "<i>dwdm:</i> " + jsonContent.dw[i].dwdm + "<br/>";          
		        finalResponse += "<i>dwmc:</i> " + jsonContent.dw[i].dwmc + "" ;                                       
		   }	   
		   $("result").innerHTML = finalResponse;
			}
    </script>
	</head>

	<body onload="shows()">
		<div id='systemWorking'
			style="z-index: 999; display: none; border: 1px solid #0e0; background-color: #efe; padding: 2px; margin-top: 8px; width: 300px; font: normal 12px Arial; color: #090">
			数据加载中...
		</div>
		<div id="page"></div>
		<div id="result"></div>
	</body>
</html>



后台数据生成的json格式。

你可能感兴趣的:(html,jsp,json,Ajax)