jquery与ajax

简化GET请求与jQuery Ajax事件

最新推荐文章于 2025-03-07 23:40:50 发布

Allen_Oscar

最新推荐文章于 2025-03-07 23:40:50 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

分类专栏： Jquery+Ajax java

本文链接：https://blog.youkuaiyun.com/allen_oscar/article/details/9068455

java 同时被 2 个专栏收录

27 篇文章

订阅专栏

Jquery+Ajax

2 篇文章

订阅专栏

本文介绍了一种简化GET请求的方法及jQuery中Ajax事件的使用。通过示例代码展示了如何进行GET请求，并介绍了jQuery提供的各种Ajax事件及其用途。

这是一个简单的 GET 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数，请使用 $.ajax。示例代码：

$.ajax({

type : "GET",

contentType: "application/x-www-form-urlencoded; charset=utf-8",

url : "ServiceServlet",

data : "username="+username+"&password="+password,

dataType : "xml",

success : callback,

error:callbackErr

});

下面是jQuery官方给出的完整的Ajax事件列表：

· ajaxStart (Global Event)
This event is broadcast if an Ajax request is started and no other Ajax requests are currently running.

· beforeSend (Local Event)
This event, which is triggered before an Ajax request is started, allows you to modify the XMLHttpRequest object (setting additional headers, if need be.)

· ajaxSend (Global Event)
This global event is also triggered before the request is run.

· success (Local Event)
This event is only called if the request was successful (no errors from the server, no errors with the data).

· ajaxSuccess (Global Event)
This event is also only called if the request was successful.

· error (Local Event)
This event is only called if an error occurred with the request (you can never have both an error and a success callback with a request).

· ajaxError (Global Event)
This global event behaves the same as the local error event.

· complete (Local Event)
This event is called regardless of if the request was successful, or not. You will always receive a complete callback, even for synchronous requests.

· ajaxComplete (Global Event)
This event behaves the same as the complete event and will be triggered every time an Ajax request finishes.

· ajaxStop (Global Event)
This global event is triggered if there are no more Ajax requests being processed.

具体的全局事件请参考API文档。

完整代码示例：前段

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'index.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script type="text/javascript"  src="jquery-1.8.3.js"></script>
	<script>
	
    function doConfig(){
	   
	 //  var username = document.getElementById("username").value;
	 //  var password = document.getElementById("password").value;
	   var username = $("#username").val();
	   var password = $("#password").val();
	   $.ajax({
		        type : "GET",
		        contentType: "application/x-www-form-urlencoded; charset=utf-8",
		        url : "ServiceServlet",
		        data : "username="+username+"&password="+password,
		        dataType : "xml",
		        success : callback,
		        error:callbackErr
		    }); 
	   
	   }
	   function callback(data){
	  
	    var  name ="";
	     $(data).find('service').each(function(i){
	        name=$(this).find('info').text();
	      });
 		  alert(name);
	   }
	  function callbackErr(data){
	   
	   alert("error");
	   }
	</script>
	
	
  </head>
  
  <body>
    <table>
         <tr>
            <td>用户名：</td>
            <td><input id="username" /></td>
         </tr>
         <tr>
            <td>密码：</td>
            <td><input id="password" /></td>
         </tr>
         <tr>
            <td></td>
            <td><input type="submit" onclick="doConfig()" /></td>
         </tr>
    </table>
  </body>
</html>

后台代码：

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;


public class ServiceServlet extends HttpServlet {

 
	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		 doPost(request,response);
	}
 
	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		   String username = request.getParameter("username");
		   String password = request.getParameter("password");
		   
		   System.out.println("用户名："+username+"密码："+password);
		   response.setContentType("text/xml");
		   response.setCharacterEncoding("utf-8");
		   response.getWriter().write("<?xml version=\"1.0\" encoding=\"utf-8\"?><service><info>success</info></service>");
		   
	}

	 
	public void init() throws ServletException {
	}

}