AJAX与java servlet结合使用的小例子

html页面代码(使用了jquery):
  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4. <script type="text/javascript" src="js/jquery-1.2.6.js">script>
  5. <script type="text/javascript">
  6. //定义一个全局的XmlHttpRequest类型的变量
  7. var xmlHttp = false;
  8. //创造一个XmlHttpRequest对象
  9. function createXmlHttpRequest() {
  10.     /* Create a new XMLHttpRequest object to talk to the Web server */
  11.     /*@cc_on @*/
  12.     /*@if (@_jscript_version >= 5)
  13.     try {
  14.       xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
  15.     } catch (e) {
  16.       try {
  17.         xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  18.       } catch (e2) {
  19.         xmlHttp = false;
  20.       }
  21.     }
  22.     @end @*/
  23.     if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
  24.       xmlHttp = new XMLHttpRequest();
  25.     }
  26. }
  27. //发送异步请求
  28. function callServer() {
  29.   createXmlHttpRequest();
  30.   var str = $("#t1").val();
  31.   var url = "test1.do";
  32.   // Open a connection to the server
  33.   xmlHttp.open("POST", url, true);
  34.   // Setup a function for the server to run when it's done
  35.   xmlHttp.onreadystatechange = updatePage;
  36.   //使用post方法提交是,这句非常重要,否则servlet无法接收参数
  37.   xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  38.   // Send the request
  39.   var param = "a=" + str;
  40.   xmlHttp.send(param);
  41.   
  42. }
  43. //回调函数,对页面内容进行更新
  44. function updatePage() {
  45.   if (xmlHttp.readyState == 4) {
  46.     var response = xmlHttp.responseText;
  47.     $("#t1").val(response);
  48.     $("#done").append(response);
  49.   }
  50. }
  51. script>
  52. <title>AJAX测试title>
  53. head>
  54. <body>
  55. <form id="form1" name="form1" method="post" action="">
  56.   <input type="text" name="t1" id="t1" />
  57.   <input type="button" name="b1" id="b1" value="提交" onclick="callServer()" />
  58.   <div id="done">div>
  59. form>
  60. body>
  61. html>
服务器端的servlet代码:
  1. package andycpp;
  2. import java.io.IOException;
  3. import javax.servlet.ServletException;
  4. import javax.servlet.http.HttpServlet;
  5. import javax.servlet.http.HttpServletRequest;
  6. import javax.servlet.http.HttpServletResponse;
  7. public class Controller extends HttpServlet {
  8.     @Override
  9.     protected void doPost(HttpServletRequest req, HttpServletResponse resp)
  10.             throws ServletException, IOException {
  11.         String s = req.getParameter("a");
  12.         resp.setContentType("text/xml");
  13.         resp.setHeader("Cache-Control""no-cache");
  14.         resp.getWriter().write(s);
  15.     }
  16. }


你可能感兴趣的:(JAVA技术)