Ajax(二) — Ajax初步 : $.post 方法与 $.ajax 方法

1.$.post方法

通过远程 HTTP POST 请求载入信息。

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

post.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<Meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script src="../../js/jquery-1.7.2.js"></script>
<script src="post.js"></script>
</head>
<body>
</body>
</html>

post.js

$(function(){
	/**
	 * 该方法是jquery对最原始的ajax请求做的封装
	 * 参数1:   url
	 * 参数2:   客户端传递的参数
	 * 参数3:   回调函数:需要注意两点:
	 * 				1.是服务器成功返回时要执行的函数
	 * 				2.该回调函数必须是readyState的值为4,status的值为200时,才能调用
	 * 					(一旦服务端出错,status状态码改变,回调函数不再执行)
	 * 参数4:	   返回内容的格式,一般都是json
	 */
	$.post("../../AjaxPostServlet",null,function(data){
		alert(data);//data就是服务器端的返回值
	});
	/**
	 * 注意:post方法只能接受到服务端响应成功后的结果,如果服务器端失败,那么post方法是无法接受到的
	 * 对于Servlet而言,如果内部出错,service方法的调用者会更改status的值
	 * 但是Struts2不会修改status的值,无论服务端是否出错,ajax都只是感应正确的返回
	 */
});

Servlet

package cnc.cil.ajax.servlet;

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 AjaxPostServlet extends HttpServlet {

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

		response.setContentType("text/html");
		PrintWriter out = response.getWriter();
		//int i = 10 / 0;
		out.println("$.post -> success");
		out.flush();
		out.close();
	}

}

2.$.ajax 方法

通过 HTTP 请求加载远程数据。

jQuery 底层 AJAX 实现。简单易用的高层实现见 $.get,$.post 等。$.ajax() 返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该函数，除非你需要操作不常用的选项，以获得更多的灵活性。

最简单的情况下，$.ajax()可以不带任何参数直接使用。

注意，所有的选项都可以通过$.ajaxSetup()函数来全局设置。

回调函数

如果要处理$.ajax()得到的数据，则需要使用回调函数。beforeSend、error、dataFilter、success、complete。

beforeSend 在发送请求之前调用，并且传入一个XMLHttpRequest作为参数。
error 在请求出错时调用。传入XMLHttpRequest对象，描述错误类型的字符串以及一个异常对象（如果有的话）
dataFilter 在请求成功之后调用。传入返回的数据以及"dataType"参数的值。并且必须返回新的数据（可能是处理过的）传递给success回调函数。
success 当请求之后调用。传入返回后的数据，以及包含成功代码的字符串。
complete 当请求完成之后调用这个函数，无论成功或失败。传入XMLHttpRequest对象，以及一个包含成功或错误代码的字符串。

ajax.js

$(function(){
	// json {key:value,key:value}
	$.ajax({
		url:"../../AjaxAjaxServlet",success:function(){//如果服务器端成功响应,则执行该函数
			alert("success");
		},error:function(){ //如果服务器端错误,则响应该函数
			alert("error");
		},type:'POST'  //默认是GET
	});
});

即使是服务端出错$.ajax方法也可以接受，所以,一般采用$.ajax的方式

Ajax(二) — Ajax初步 : $.post 方法与 $.ajax 方法

猜你在找的Ajax相关文章