JSP部分：
<%@ page language="java" import="java.util.*" pageEncoding="gbk"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head>
<title>My JSP 'index.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"> var xmlHttp; function createXMLHttpRequest(){ if (window.ActiveXObject) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } else if (window.XMLHttpRequest) { xmlHttp = new XMLHttpRequest(); } } function doStart() { createXMLHttpRequest(); var url = "DynamicUpdateServlet?task=reset"; xmlHttp.open("GET", url, true); xmlHttp.onreadystatechange = startCallback; xmlHttp.send(null); } function startCallback() { if (xmlHttp.readyState == 4) { if (xmlHttp.status == 200) { setTimeout("pollServer()", 5000); refreshTime(); } } } function pollServer() { createXMLHttpRequest(); var url = "DynamicUpdateServlet?task=foo"; xmlHttp.open("GET", url, true); xmlHttp.onreadystatechange = pollCallback; xmlHttp.send(null); } function refreshTime(){ var time_span = document.getElementById("time"); var time_val = time_span.innerHTML; var int_val = parseInt(time_val); var new_int_val = int_val - 1; if (new_int_val > -1) { setTimeout("refreshTime()", 1000); time_span.innerHTML = new_int_val; } else { time_span.innerHTML = 5; } } function pollCallback() { if (xmlHttp.readyState == 4) { if (xmlHttp.status == 200) { var message =xmlHttp.responseXML.getElementsByTagName("message")[0].firstChild.data; if (message != "done") { var new_row = createRow(message); var table = document.getElementById("dynamicUpdateArea"); var table_body =table.getElementsByTagName("tbody").item(0); var first_row =table_body.getElementsByTagName("tr").item(1); table_body.insertBefore(new_row, first_row); setTimeout("pollServer()", 5000); refreshTime(); } } } } function createRow(message) { var row = document.createElement("tr"); var cell = document.createElement("td"); var cell_data = document.createTextNode(message); cell.appendChild(cell_data); row.appendChild(cell); return row; } </script></head><body> <h1> Ajax Dynamic Update Example </h1> This page will automatically update itself: <input type="button" value="Launch" id="go" οnclick="doStart();" /> <p> Page will refresh in <span id="time">5</span> seconds. <p> <table id="dynamicUpdateArea" align="left"> <tbody> <tr id="row0"> <td></td> </tr> </tbody> </table></body></html>
Servlet部分：
public class DynamicUpdateServlet extends HttpServlet {
private int counter = 1;
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { this.doPost(request, response);}
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String res = ""; String task = request.getParameter("task"); String message = ""; if (task.equals("reset")) { counter = 1; } else { switch (counter) { case 1: message = "Steve walks on stage"; break; case 2: message = "iPods rock"; break; case 3: message = "Steve says Macs rule"; break; case 4: message = "Change is coming"; break; case 5: message = "Yes, OS X runs on Intel - has for years"; break; case 6: message = "Macs will soon have Intel chips"; break; case 7: message = "done"; break; } counter++; } res = "<message>" + message + "</message>"; PrintWriter out = response.getWriter(); response.setContentType("text/xml"); response.setHeader("Cache-Control", "no-cache"); out.println("<response>"); out.println(res); out.println("</response>"); out.close();}
}
相关资源：Ajax实现页面自动刷新实例解析