AJAX基础教程－7 AutoRefresh Page

js 代码

1. <script type=< span="">"text/javascript">   
2. var xmlHttp;   
3.     function createXMLHttpRequest() {   
4.         if (window.ActiveXObject) {   
5.         xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");   
6.         }   
7.         else if (window.XMLHttpRequest) {   
8.         xmlHttp = new XMLHttpRequest();   
9.         }   
10.     }   
11.     function doStart() {   
12.         createXMLHttpRequest();   
13.         var url = "DynamicUpdate?task=reset";   
14.         xmlHttp.open("GET", url, true);   
15.         xmlHttp.onreadystatechange = startCallback;   
16.         xmlHttp.send(null);   
17.     }   
18.     function startCallback() {   
19.         if (xmlHttp.readyState == 4) {   
20.             if (xmlHttp.status == 200) {   
21.             setTimeout("pollServer()", 5000);   
22.             refreshTime();   
23.             }   
24.         }   
25.     }   
26.   
27.     function pollServer() {   
28.         createXMLHttpRequest();   
29.         var url = "DynamicUpdateServlet?task=foo";   
30.         xmlHttp.open("GET", url, true);   
31.         xmlHttp.onreadystatechange = pollCallback;   
32.         xmlHttp.send(null);   
33.     }   
34.        
35.     function refreshTime(){   
36.         var time_span = document.getElementById("time");   
37.         var time_val = time_span.innerHTML;   
38.         var int_val = parseInt(time_val);   
39.         var new_int_val = int_val - 1;   
40.         if (new_int_val > -1) {   
41.         setTimeout("refreshTime()", 1000);   
42.         time_span.innerHTML = new_int_val;   
43.         } else {   
44.         time_span.innerHTML = 5;   
45.         }   
46.     }   
47.        
48.     function pollCallback() {   
49.         if (xmlHttp.readyState == 4) {   
50.             if (xmlHttp.status == 200) {   
51.                 var message =   
52.                 xmlHttp.responseXML   
53.                 .getElementsByTagName("message")[0].firstChild.data;   
54.                 if (message != "done") {   
55.                 var new_row = createRow(message);   
56.                 var table = document.getElementById("dynamicUpdateArea");   
57.                 var table_body =   
58.                 table.getElementsByTagName("tbody").item(0);   
59.                 var first_row =   
60.                 table_body.getElementsByTagName("tr").item(1);   
61.                 table_body.insertBefore(new_row, first_row);   
62.                 setTimeout("pollServer()", 5000);   
63.                 refreshTime();   
64.                 }   
65.             }   
66.         }   
67.     }   
68.        
69.     function createRow(message) {   
70.         var row = document.createElement("tr");   
71.         var cell = document.createElement("td");   
72.         var cell_data = document.createTextNode(message);   
73.         cell.appendChild(cell_data);   
74.         row.appendChild(cell);   
75.         return row;   
76.     }   
77. </script>  

java 代码

1. package ajax.foundations_of_ajax;   
2.   
3. import java.io.IOException;   
4. import java.io.PrintWriter;   
5.   
6. import javax.servlet.ServletException;   
7. import javax.servlet.http.HttpServlet;   
8. import javax.servlet.http.HttpServletRequest;   
9. import javax.servlet.http.HttpServletResponse;   
10.   
11. public class DynamicUpdateServlet extends HttpServlet {   
12.     private int counter = 1;   
13.   
14.     /**  
15.      * Handles the HTTP GET method.  
16.      *   
17.      * @param request  
18.      *            servlet request  
19.      * @param response  
20.      *            servlet response  
21.      */  
22.     protected void doGet(HttpServletRequest request,   
23.             HttpServletResponse response) throws ServletException, IOException {   
24.         String res = "";   
25.         String task = request.getParameter("task");   
26.         String message = "";   
27.         if (task.equals("reset")) {   
28.             counter = 1;   
29.         } else {   
30.             switch (counter) {   
31.             case 1:   
32.                 message = "Steve walks on stage";   
33.                 break;   
34.             case 2:   
35.                 message = "iPods rock";   
36.                 break;   
37.             case 3:   
38.                 message = "Steve says Macs rule";   
39.                 break;   
40.             case 4:   
41.                 message = "Change is coming";   
42.                 break;   
43.             case 5:   
44.                 message = "Yes, OS X runs on Intel - has for years";   
45.                 break;   
46.             case 6:   
47.                 message = "Macs will soon have Intel chips";   
48.                 break;   
49.             case 7:   
50.                 message = "done";   
51.                 break;   
52.             }   
53.             counter++;   
54.         }   
55.         res = "<message></message>" + message + "";   
56.         PrintWriter out = response.getWriter();   
57.         response.setContentType("text/xml");   
58.         response.setHeader("Cache-Control", "no-cache");   
59.         out.println("<response></response>");   
60.         out.println(res);   
61.         out.println("");   
62.         out.close();   
63.     }   
64. }