ajax请求中的6个全局事件

//事件触发顺序ajaxStart,ajaxSend,ajaxSuccess或ajaxError,ajaxComplete,ajaxStop

$(document).ajaxStart(function (event) {
    /*
     * 每一个ajax即将发送的时候触发该事件,只有一个事件对象参数
     */
    console.log('ajaxStart');
})

$(document).ajaxSend(function (event,xhr,opts,err) {
    /*
     * 每一个ajax即将发送的时候触发该事件
     * 此方法接受四个参数,分别是事件对象,XHR对象,和发起ajax请求的配置对象,错误信息
     */
    if(opts.type == 'get'){
        xhr.abort();
    }    
})

$(document).ajaxSuccess(function (event,xhr,opts) {
    /*
     * 此方法接受三个参数,分别是事件对象,XHR对象,和发起ajax请求的配置对象
     * 每一个ajax请求成功都会触发该事件
     * 配置对象中的success回调会先执行,然后再执行这个事件
     */
    console.log(JSON.parse(xhr.responseText))
})

$(document).ajaxError(function (event,xhr,opts,err) {
    /*
     * 此方法接受四个参数,分别是事件对象,XHR对象,和发起ajax请求的配置对象,错误信息
     * 每一个ajax请求失败都会触发该事件
     * 配置对象中的error回调会先执行,然后再执行这个事件
     * 如果是客户端错误导致请求失败,err的值有可能是timeout,error,abort,或者是抛出错误异常对象
     */
    console.log(err)
})

$(document).ajaxComplete(function (event,xhr,opts) {
    /*
     * 此方法接受三个参数,分别是事件对象,XHR对象,和发起ajax请求的配置对象
     * 每一个ajax请求完成都会触发该事件,不管请求的结果如何
     * 配置对象中的complete回调会先执行,然后再执行这个事件
     */
})

$(document).ajaxStop(function (event) {
    /*
     * 此方法只接受一个事件对象参数,此事件只触发一次
     * 当所有ajax请求完成的时候调用一次,不管ajax请求的状态是失败还是成功或是被取消
     */
})

 注意:ajaxStart和ajaxSend事件必须放在ajax请求代码之前,不然不会触发

posted @ 2017-10-25 16:27  向着太阳生  阅读(2085)  评论(0编辑  收藏  举报