(Jquery 功能篇) Jquery ajax异步加载分析

阿里 阅读:300 2021-04-01 10:03:34 评论:0


1.前段页面效果

2.前段页面代码

  1. <input type="text" id="param1"/> +  
  2.     <input type="text" id="param2"/> =  
  3. <input type="text" id="result"><input type="button" value="get content from server" id="button1">  

3.服务器端代码

  1. public void doPost(HttpServletRequest request, HttpServletResponse response)  
  2.             throws ServletException, IOException {  
  3.   
  4.         int param1 = Integer.parseInt(request.getParameter("param1"));  
  5.         int param2 = Integer.parseInt(request.getParameter("param2"));  
  6.         response.setHeader("pragma""no-cache");  
  7.         response.setHeader("cache-control""no-cache");  
  8.         PrintWriter out = response.getWriter();  
  9.           
  10.         out.println(String.valueOf(param1+param2));  
  11.         out.flush();  
  12.     }  
public void doPost(HttpServletRequest request, HttpServletResponse response) 
			throws ServletException, IOException { 
 
		int param1 = Integer.parseInt(request.getParameter("param1")); 
		int param2 = Integer.parseInt(request.getParameter("param2")); 
		response.setHeader("pragma", "no-cache"); 
		response.setHeader("cache-control", "no-cache"); 
		PrintWriter out = response.getWriter(); 
		 
		out.println(String.valueOf(param1+param2)); 
		out.flush(); 
	}

4.前段页面脚本处理代码

[javascript] view plain copy print ?
  1. <script type="text/javascript">  
  2.         $(function(){  
  3.             $("#button1").click(function(){  
  4.                 $.ajax({ //no need to judge the browser type  
  5.                     type: "POST"//类型  
  6.                     url: "MyServlet"//请求访问的servlet  
  7.                     dataType: "html",     
  8.                     data: { 'param1':$("#param1").val(),'param2':$("#param2").val()}, //传递的参数  
  9.                     success: function(returnedData){   //成功返回的回调函数  
  10.                         $("#result").val(returnedData);  
  11.                     }  
  12.                 });  
  13.             });  
  14.         });  
  15.     </script>  



声明

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

发表评论
搜索
KIKK导航

KIKK导航

排行榜
关注我们

一个IT知识分享的公众号