jQuery中Ajax事件

参考资料地址：
http://docs.jquery.com/Ajax_Events
Ajax会触发很多事件。
有两种事件，一种是局部事件，一种是全局事件：

局部事件：通过$.ajax来调用并且分配。

1. $.ajax({
2. beforeSend: function(){
3. // Handle the beforeSend event
4. },
5. complete: function(){
6. // Handle the complete event
7. }
8. // ...
9. });

全局事件，可以用bind来绑定，用unbind来取消绑定。这个跟click/mousedown/keyup等事件类似。但他可以传递到每一个DOM元素上。

1. $("#loading").bind("ajaxSend", function(){ //使用bind
2.     $(this).show();
3. }).ajaxComplete(function(){ //直接使用ajaxComplete
4.     $(this).hide();
5. });

当然，你某一个Ajax请求不希望产生全局的事件，则可以设置global:false

1. $.ajax({
2. url: "test.html",
3. global: false,
4. // ...
5. });

事件的顺序如下：
ajaxStart全局事件
开始新的Ajax请求，并且此时没有其他ajax请求正在进行。
beforeSend局部事件
当一个Ajax请求开始时触发。如果需要，你可以在这里设置XHR对象。
ajaxSend全局事件
请求开始前触发的全局事件
success局部事件
请求成功时触发。即服务器没有返回错误，返回的数据也没有错误。
ajaxSuccess全局事件
全局的请求成功
error局部事件
仅当发生错误时触发。你无法同时执行success和error两个回调函数。
ajaxError全局事件
全局的发生错误时触发
complete局部事件
不管你请求成功还是失败，即便是同步请求，你都能在请求完成时触发这个事件。
ajaxComplete全局事件
全局的请求完成时触发
ajaxStop全局事件
当没有Ajax正在进行中的时候，触发。

局部事件回调的参数在文档中写的很清楚了，这里就不累述了。

全局事件中，除了ajaxStart和ajaxStop之外，其他的事件都有3个参数
event, XMLHttpRequest, ajaxOptions
第一个是事件，第二个是XHR对象，第三个参数最有用，是当时调用这个ajax的时候的参数。
对于ajaxError,还有第四个参数thrownError，只有当异常发生时才会被传递。
我们可以利用ajaxOptions来写一个全局的ajax事件。
比如

1. $("#msg").beforeSend(function(e,xhr,o) {
2.     $(this).html("正在请求"+o.url);
3. }).ajaxSuccess(function(e,xhr,o) {
4.     $(this).html(o.url+"请求成功");
5. }).ajaxError(function(e,xhr,o) {
6.     $(this).html(o.url+"请求失败");
7. });

对于这个例子，
这样我们就可以很方便的全局地在某个地方显示当前的ajax状态。
当然，之前说了，第三个参数实际上是传递给ajax的参数。get/post/load/getScript/getJSON等方法本质上都是调用ajax方法的，所以ajaxOptions.url属性总是有效的。

还有更丰富的例子。
如果你用ajax调用，还可以传递自定义参数。下面的例子我就自定义了一个msg参数给了ajax调用

1. //自定义参数msg
2. $.ajax({url:"test1.html",type:"get",msg:"页面一"});
3. $.ajax({url:"test2.html",type:"get",msg:"页面二"});
4. $.ajax({url:"test3.html",type:"get",msg:"页面三"});
5. $.ajax({url:"test4.html",type:"get",msg:"页面四"});
7. //这里就能获取到自定义参数msg。
8. //这可以用来区别对待不同的ajax请求。
9. $("#msg").beforeSend(function(e,xhr,o) {
10.     $(this).html("正在请求"+o.msg);
11. }).ajaxSuccess(function(e,xhr,o) {
12.     $(this).html(o.msg+"请求成功");
13. }).ajaxError(function(e,xhr,o) {
14.     $(this).html(o.msg+"请求失败");
15. });

最后对于load方法，还有话说。
其他的简易ajax方法，比如get,post,getJSON等，他们的回调函数都是设置了success回调。
而只有load设置的其实是complete回调。
所以，load里设置的回调函数的参数应该有2个。
XMLHttpRequest和textStatus
但实际上也并非如此。
load的回调有三个参数
XMLHttpRequest.responseText, textStatus, XMLHttpRequest
所以，你可以在load的回调里
通过textStatus==”success”或者textStatus==”error”来判断是否调用成功。
或者用XMLHttpRequest.status属性判断是200还是404或者其他的。

这点上，我认为比普通的get/post等方法更先进。如果要单数设置每get的error是不可能的。但是设置一个全局的ajaxError其实也是不错的选择。