jQuery与Ajax(三)

1.jQuery中的AJAX事件

在jQuery中有两类AJAX事件:AJAX局部事件和AJAX全局事件

①AJAX局部事件

AJAX局部事件在$.ajax()函数中使用,前面已对该函数的参数做过详细的解释,一共有beforeSend,success,error,complete 4种AJAX局部事件,这些事件注册的函数的使用,我们也在讲$.ajax()函数时提到过,这里就不再讲述了。

②AJAX全局事件

全局函数是每次AJAX请求都会触发的,它会向DOM中的所有元素广播,AJAX全局事件其实就跟普通事件click,mousedown等一样使用,只不过它们只有在ajax不同请求过程中被触发。也可以使用bind()和unbind()函数来绑定或取消绑定,关于AJAX全局事件我们关键要弄明白其执行顺序及其与局部事件在一起使用时的执行顺序。

拿ajaxStart()为例

$("#2").ajaxStart(function(){

$(this).css("border-width","20px");

})

在AJAX请求的时候触发,将给#2添加css样式,还可以用bind()的形式写:

$("#2").bind("ajaxStart",function(){

$(this).css("border-width","20px");}

)

可以看到所绑定的函数没有任何参数(ajaxStop()也是没有参数的),不过在有些AJAX全局事件所绑定的函数是有参数的,关于为事件所绑定的函数传递参数可以参考http://kendezhu.iteye.com/blog/986032中的2  不过为AJAX事件所绑定的函数传递的参数不是开发者定义的,而是jQuery自动传递的,如下面的event

ajaxSuccess()

$("#3").ajaxSuccess(function(event,XMLHttpRequest,ajaxoptions){

alert(event);

alert(XMLHttpRequest);

alert(ajaxoptions);

})

另外俩参数一个是XMLHttpRequest对象  一个是当前AJAX的属性对象

其他与ajaxSuccess()有相同参数的AJAX全局事件有ajaxSend()和ajaxComplete()

有四个参数的是ajaxError() 它的前三个参数一样  第四个参数是错误代码

$("#3").ajaxSuccess(function(event,XMLHttpRequest,ajaxoptions,throwError){

alert(event);

alert(XMLHttpRequest);

alert(ajaxoptions);

alert(throwError);

})

前面已经说了,这些事件只有在进行ajax请求时才会被触发,它们在和那些AJAX局部事件在一起时被触发的顺序如下:

ajaxStart->beforeSend->ajaxSend->success->ajaxSuccess->complete->ajaxComplete->ajaxStop