AJAX与Servlet例子
页面代码：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head> <title>HelloServlet.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <!--<link rel="stylesheet" type="text/css" href="./styles.css">--><script type="text/javascript">var outMsg = "";var xhr;function createXMLHttpRequest(){if(window.ActiveXObject){xhr = new ActiveXObject("Microsoft.XMLHTTP");}else if(window.XMLHttpRequest){xhr = new XMLHttpRequest();}}function createQueryString(){var userName = document.getElementById("username").value;var queryString = "userName="+userName;return queryString;}function doRequest(){createXMLHttpRequest();var queryString = "HelloAjaxJava1?";queryString = queryString + createQueryString();xhr.onreadystatechange = handleStatechange;xhr.open("POST",queryString,true);xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");xhr.send(null);}function handleStatechange(){if(xhr.readyState == 4){if(xhr.status == 200){parseResults();}}}function parseResults(){responseDiv = document.getElementById("serverResponse");if(responseDiv.hasChildNodes()){responseDiv.removeChild(responseDiv.childNodes);}var responseText = document.createTextNode(xhr.responseText);responseDiv.appendChild(responseText);}</script></head><body> <form action = "#"> password: <input type = "password" id = "username"/> <input type = "reset" value = "reset"/> <input type = "button" id = "submission" value = "submit" /> </form> <h2>server response</h2> <div id = "serverResponse"></div></body></html>
Servlet代码：
import java.io.IOException;import java.io.PrintWriter;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;public class HelloAjaxJava1 extends HttpServlet {/** * Constructor of the object. */public HelloAjaxJava1() {super();}/** * Destruction of the servlet. <br> */public void destroy() {super.destroy(); // Just puts "destroy" string in log// Put your code here}/** * The doGet method of the servlet. <br> * * This method is called when a form has its tag value method equals to get. ** @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */public void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {response.setContentType("text/html");PrintWriter out = response.getWriter();out.println("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");out.println("<HTML>");out.println("<HEAD><TITLE>A Servlet</TITLE></HEAD>");out.println("<BODY>");out.print(" This is ");out.print(this.getClass());out.println(", using the GET method");out.println("</BODY>");out.println("</HTML>");out.flush();out.close();}/** * The doPost method of the servlet. <br> * * This method is called when a form has its tag value method equals to post. ** @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */public void doPost(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {response.setContentType("text/html");request.setCharacterEncoding("utf-8");response.setCharacterEncoding("utf-8");PrintWriter out = response.getWriter();String userName = request.getParameter("userName");String userText = "密码是 : "+userName;out.println(userText);out.flush();out.close();}/** * Initialization of the servlet. <br> * * @throws ServletException if an error occurs */public void init() throws ServletException {// Put your code here}}
http://dl.iteye.com/upload/attachment/426717/de08a036-495c-3d49-861e-8c95d1255ccb.jpg
页:
[1]