Ajax Zero to Hero (1) 入门

最新推荐文章于 2024-10-17 14:55:15 发布

个人知识管理布道师

最新推荐文章于 2024-10-17 14:55:15 发布

阅读量418

点赞数

文章标签： ajax

本文链接：https://blog.csdn.net/u010689306/article/details/51891191

版权

Ajax 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
    <!-- 
         AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。 
                  通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。
                  这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新   
    -->
    <script type="text/javascript">
       //AJAX - 创建 XMLHttpRequest对象
       var xmlhttp;//XMLHttpRequest对象用于和服务器交换数据。
       if(window.XMLHttpRequest){
    	   xmlhttp = new XMLHttpRequest();
       }else{
    	   //兼容IE6,IE5
    	   xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
       }
       
       //get the reponse of XMLHttpRequest
       xmlhttp.onreadystatechange=function(){
    	   if(xmlhttp.readyState == XMLHttpRequest.DONE){
    		   window.alert(xmlhttp.responseText)//得到响应数据  
    	   }
       };
       
       //模拟表单数据提交的post请求(async=false,JavaScript会等到服务器响应就绪才继续执行。如果服务器繁忙或缓慢，应用程序会挂起或停止。)
       xmlhttp.open("POST", "TestAjaxServlet", true);
       //设置请求头,表明发送的是表单数据
       xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
       //模拟表单参数
       xmlhttp.send("fname=Bill&lname=GATEs");
       
     /*通过 AJAX，JavaScript 无需等待服务器的响应，而是：
           在等待服务器响应时执行其他脚本
           当响应就绪后对响应进行处理*/
          
    </script>
</body>
</html>

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	      String fname = request.getParameter("fname");
	      String lname = request.getParameter("lname");
	      System.out.println("fname="+fname);
	      System.out.println("lname="+ lname);
		  PrintWriter out = response.getWriter();
	      out.write("server return ajax test data");
	}

参考资料

https://developer.mozilla.org/en/docs/AJAX

https://www.ibm.com/developerworks/ajax/