AJAX调用SERVLET例子（z）
出处：http://blog.csdn.net/xiaxiaorui2003/archive/2009/04/16/4083194.aspx
工作需要自己写了个例子调用SERVLET的，可以运行，
很简单就是一个index.jsp页面，一个GetAndPostExample servlet后台，和WEB.XML配置文件
index.jsp页面
view plaincopy to clipboardprint? 1. <%@ page language="java" import="java.util.*" pageEncoding="gb2312"%> 2. <%request.setCharacterEncoding("GB2312");%> 3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4. <html xmlns="http://www.w3.org/1999/xhtml"> 5. <head> 6. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 7. <title>AJAX测试</title> 8. <mce:script language="javascript"><!-- 9. var xmlHttp; 10. //创建xmlHttp 11. function createXMLHttpRequest() 12. { 13. if(window.ActiveXObject) 14. { 15. xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); 16. } 17. else if(window.XMLHttpRequest) 18. { 19. xmlHttp=new XMLHttpRequest(); 20. } 21. } 22. 23. //拼出要发送的姓名数据 24. function createQueryString() 25. { 26. var firstName=document.getElementById("firstname").value; 27. var middleName=document.getElementById("middleName").value; 28. var birthday=document.getElementById("birthday").value; 29. 30. var queryString="firstName=" + firstName + "&middleName=" + middleName + "&birthday=" + birthday; 31. return queryString; 32. } 33. 34. //使用get方式发送 35. function doRequestUsingGET() 36. { 37. createXMLHttpRequest(); 38. var queryString="./GetAndPostExample?"; 39. queryString=queryString+createQueryString() + "&timeStamp=" + new Date().getTime(); 40. xmlHttp.onreadystatechange=handleStateChange; 41. xmlHttp.open("GET",queryString,true); 42. xmlHttp.send(null); 43. } 44. 45. //使用post方式发送 46. function doRequestUsingPost() 47. { 48. createXMLHttpRequest(); 49. var url="./GetAndPostExample?timeStamp=" + new Date().getTime(); 50. var queryString=createQueryString(); 51. xmlHttp.open("POST",url,true); 52. xmlHttp.onreadystatechange=handleStateChange; 53. xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); 54. xmlHttp.send(queryString); 55. } 56. 57. 58. function handleStateChange() 59. { 60. if(xmlHttp.readyState==4) 61. { 62. if(xmlHttp.status==200) 63. { 64. parseResults(); 65. } 66. } 67. } 68. 69. //解析返回值 70. function parseResults() 71. { 72. var responseDiv=document.getElementById("serverResponse"); 73. if(responseDiv.hasChildNodes()) 74. { 75. responseDiv.removeChild(responseDiv.childNodes[0]); 76. } 77. var responseText=document.createTextNode(xmlHttp.responseText); 78. alert("后台返回的返回值： "+xmlHttp.responseText); 79. responseDiv.appendChild(responseText); 80. } 81. // --></mce:script> 82. </head> 83. 84. <body> 85. <form id="form1" name="form1" method="post" action="#"> 86. <p><br /> 87. <br /> 88. 姓：<input name="firstName" type="text" id="firstName" /> 89. </p> 90. <p> 91. <label> 92. 名：<input type="text" name="middleName" id="middleName" /> 93. </label> 94. </p> 95. <p> 96. 生日：<input name="birthday" type="text" id="birthday" /> 97. </p> 98. <p> </p> 99. <p> 100. <input type="button" name="Submit" value="GET" onclick="doRequestUsingGET();"/> 101. 102. <input type="button" name="Submit2" value="POST" onclick="doRequestUsingPost();"/> 103. </p> 104. 105. <div id="serverResponse"></div> 106. </form> 107. 108. </body> 109. </html> ?GetAndPostExample
-------------------------------------------------------------------
view plaincopy to clipboardprint? 1. package temp; 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 GetAndPostExample extends HttpServlet { 12. 13. /** 14. * Constructor of the object. 15. */ 16. public GetAndPostExample() { 17. super(); 18. } 19. 20. /** 21. * Destruction of the servlet. <br> 22. */ 23. public void destroy() { 24. super.destroy(); // Just puts "destroy" string in log 25. // Put your code here 26. } 27. 28. /** 29. * The doGet method of the servlet. <br> 30. * 31. * This method is called when a form has its tag value method equals to get. 32. * 33. * @param request 34. * the request send by the client to the server 35. * @param response 36. * the response send by the server to the client 37. * @throws ServletException 38. * if an error occurred 39. * @throws IOException 40. * if an error occurred 41. */ 42. public void doGet(HttpServletRequest request, HttpServletResponse response) 43. throws ServletException, IOException { 44. 45. doPost(request, response); 46. } 47. 48. /** 49. * The doPost method of the servlet. <br> 50. * 51. * This method is called when a form has its tag value method equals to 52. * post. 53. * 54. * @param request 55. * the request send by the client to the server 56. * @param response 57. * the response send by the server to the client 58. * @throws ServletException 59. * if an error occurred 60. * @throws IOException 61. * if an error occurred 62. */ 63. public void doPost(HttpServletRequest request, HttpServletResponse response) 64. throws ServletException, IOException { 65. 66. String data = ""; 67. String temp = ""; 68. 69. temp = (String) request.getParameter("firstName"); 70. data = data + "第一个名字" + temp; 71. temp = (String) request.getParameter("middleName"); 72. data = data + " 中间的名字" + temp; 73. temp = (String) request.getParameter("birthday"); 74. data = data + " 生日" + temp; 75. temp = (String) request.getParameter("timeStamp"); 76. data = data + " 调用时间" + temp; 77. 78. System.out.println("获得的数据 " + data); 79. 80. response.setContentType("text/html;charset=gb2312"); 81. 82. PrintWriter out = response.getWriter(); 83. 84. out.println(data); 85. out.flush(); 86. out.close(); 87. } 88. 89. /** 90. * Initialization of the servlet. <br> 91. * 92. * @throws ServletException 93. * if an error occurs 94. */ 95. public void init() throws ServletException { 96. // Put your code here 97. } 98. 99. } ?web.xml
-------------------------------------------------------------------
?
view plaincopy to clipboardprint? 1. <?xml version="1.0" encoding="UTF-8"?> 2. <web-app version="2.4" 3. xmlns="http://java.sun.com/xml/ns/j2ee" 4. xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 5. xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee 6. http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"> 7. <servlet> 8. <description>This is the description of my J2EE component</description> 9. <display-name>This is the display name of my J2EE component</display-name> 10. <servlet-name>GetAndPostExample</servlet-name> 11. <servlet-class>temp.GetAndPostExample</servlet-class> 12. </servlet> 13. 14. <servlet-mapping> 15. <servlet-name>GetAndPostExample</servlet-name> 16. <url-pattern>/GetAndPostExample</url-pattern> 17. </servlet-mapping> 18. <welcome-file-list> 19. <welcome-file>index.jsp</welcome-file> 20. </welcome-file-list> 21. </web-app>