ajax 异步 通信 小例子 servlet与 jsp异步 post方法

 post请求 url后面加参数 接收不到的,必须 放到send("use"=user)形式

还要加上

 xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

servlet

 1 package cn.itcast.controller;
 2 
 3 import java.io.IOException;
 4 import javax.servlet.ServletException;
 5 import javax.servlet.annotation.WebServlet;
 6 import javax.servlet.http.HttpServlet;
 7 import javax.servlet.http.HttpServletRequest;
 8 import javax.servlet.http.HttpServletResponse;
 9 
10 @WebServlet("/servlet/ServletDemo2")
11 public class ServletDemo2 extends HttpServlet {
12     private static final long serialVersionUID = 1L;
13 
14     public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
15     }
16 
17     public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
18         //System.out.println("ServletDemo2 doPost running");
19         String username = request.getParameter("username");
20         String password = request.getParameter("password");
21         System.out.println(username+":"+password);
22     }
23 
24 }

 

jsp

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 5 <title>AJAX进行post方式的请求测试</title>
 6 </head>
 7 <body>
 8     <input type="button" id="b1" name="b1" value="测试与服务器的通信"/>
 9     <div id="d1">
10                 
11     </div>
12     <script type="text/javascript">
13         
14         window.onload=function(){
15             document.getElementById("b1").onclick = function(){
16                 //获取xmlhttpRequest对象
17                 var xhr = createXmlHttpRequest();
18                 //注册状态变化的回调函数
19                 xhr.onreadystatechange = function(){
20                     if (xhr.readyState == 4) {
21                         if (xhr.status == 200 || xhr.status == 304) {
22                         //什么都不做
23                         }
24                     }
25                 }
26                 //初始化xmlhttpRequest对象,即open
27                 xhr.open("POST", "/ajaxday02/servlet/ServletDemo2?time=" + new Date().getTime());
28                 //设置请求消息头,告知服务器,发送的正文数据的类型。
29                 xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
30                 //发送数据
31                 xhr.send("username=admin&password=123");
32             }
33         }
34         function createXmlHttpRequest(){
35            var xmlHttp;
36            try{    //Firefox, Opera 8.0+, Safari
37                    xmlHttp=new XMLHttpRequest();
38             }catch (e){
39                    try{    //Internet Explorer
40                           xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
41                     }catch (e){
42                           try{
43                                   xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
44                           }catch (e){}  
45                    }
46             }
47            return xmlHttp;
48          }
49 
50     </script>
51 </body>
52 </html>

 

posted on 2014-05-30 18:59  wf110  阅读(3025)  评论(0编辑  收藏  举报