javascript异步请求，get和post

post请求

<script type="text/javascript" src="/js/jquery-1.8.3.js"></script>
<script type="text/javascript">
	// 第一步：创建XMLHttpRequest对象。(ActiveXObject)
	(function(){
		// MSIE8+、firefox、opera、chrome
		if (window.XMLHttpRequest){
			window.xhr = new XMLHttpRequest();
		}else{ // msie7以下 (ActiveXObject)
			// 定义ActiveX控制的版本号
			var xmls = ["MSXML2.XMLHTTP.7.0",
				    "MSXML2.XMLHTTP.6.0",
				    "MSXML2.XMLHTTP.5.0",
				    "Microsoft.XMLHTTP"];
		
			for (var i = 0; i < xmls.length; i++){
				try{
					window.xhr = new s(xmls[i]);
					break;
				}catch(ex){
					alert(ex);
				}
			}
		}
	})();
	
	window.onload = function(){
		document.getElementById("btn").onclick = function(){
			// 获取用户名
			var userId = document.getElementById("userId").value;
			// 获取密码
			var pwd = document.getElementById("pwd").value;
			
			// 第二步： 打开服务器之间的连接。
		    // 第一个参数：请求的方式(get|post)
		    // 第二个参数：请求的url
		    // 第三个参数：是异步还是同步 true: 异步 false: 同步
		    xhr.open("post", "post.action", true);
			
			// post请求一定设置请求头
			xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
			// 第三步：发送请求
			xhr.send("userId=" + userId + "&pwd=" + pwd);
			
			// 为xhr绑定事件监听函数
			xhr.onreadystatechange = function(){
				//alert(xhr.readyState);
				if (xhr.readyState == 4){ // 代表读取服务器的响应数据完成
					alert(xhr.status);
					if (xhr.status == 200){ // 代表服务器响应正常
						// 获取响应的数据
						alert(xhr.responseText);
					}
				}
			};
		};
		
	};
</script>

get请求 <script type="text/javascript">
	// 第一步：创建XMLHttpRequest对象。(ActiveXObject)
	(function(){
		// MSIE8+、firefox、opera、chrome
		if (window.XMLHttpRequest){
			window.xhr = new XMLHttpRequest();
		}else{ // msie7以下 (ActiveXObject)
			// 定义ActiveX控制的版本号
			var xmls = ["MSXML2.XMLHTTP.7.0",
				    "MSXML2.XMLHTTP.6.0",
				    "MSXML2.XMLHTTP.5.0",
				    "Microsoft.XMLHTTP"];
		
			for (var i = 0; i < xmls.length; i++){
				try{
					window.xhr = new s(xmls[i]);
					break;
				}catch(ex){
					alert(ex);
				}
			}
		}
	})();
	
	window.onload = function(){
		document.getElementById("btn").onclick = function(){
			// 获取用户名
			var userId = document.getElementById("userId").value;
			// 获取密码
			var pwd = document.getElementById("pwd").value;
			
			// 第二步： 打开服务器之间的连接。
		    // 第一个参数：请求的方式(get|post)
		    // 第二个参数：请求的url
		    // 第三个参数：是异步还是同步 true: 异步 false: 同步
		    xhr.open("get", "login.action?userId=" + userId + "&pwd=" + pwd, true);
			
			// 第三步：发送请求
			xhr.send();
			
			// 为xhr绑定事件监听函数
			xhr.onreadystatechange = function(){
				//alert(xhr.readyState);
				if (xhr.readyState == 4){ // 代表读取服务器的响应数据完成
					alert(xhr.status);
					if (xhr.status == 200){ // 代表服务器响应正常
						// 获取响应的数据
						alert(xhr.responseText);
					}
				}
			};
			
			
			
		};
		
	};
</script>

	
<input type="text" name="userId" id="userId"/>
<input type="password" name="pwd" id="pwd"/>
<input type="button" id="btn" value="提交"/>

@WebServlet("/post.action")
public class PostServlet extends HttpServlet {
	@Override
	protected void service(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		
		request.setCharacterEncoding("utf-8");//如果是post请求加上这句
		String userId = request.getParameter("userId");
		String pwd = request.getParameter("pwd");
		System.out.println(userId + "---" + pwd);
		

		
		response.setContentType("text/html; charset=utf-8");
		response.getWriter().print("服务器响应的数据：" + userId);
		
	}
}