jquery xhr upload属性包装-CSDN博客

用html5新的 XMLHttpRequest 和 File API，同时又用jquery。

新的xhr上，有个upload属性，可以在上面绑定progress监听。

而jquery包装后的xhr（这里指常规如complete，beforeSend回调中返回的xhr），是没有upload属性的

所以~~要利用jquery的api再包装下，两种方式：全局级别 or 请求级别

//全局级别
//重写（确切的说是扩展）xhr生成方法，
var oldXHR = jQuery.ajaxSettings.xhr; 
jQuery.ajaxSettings.xhr = function() {
    var xhr = oldXHR();
    if(xhr instanceof window.XMLHttpRequest) {
        xhr.upload.addEventListener('progress', on_progress, false);
        xhr.upload.addEventListener('load', on_loaded, false);
        xhr.addEventListener('abort', on_abort, false);
    }
    return xhr;
};

//请求级别
//利用$.ajax的参数xhr
$.ajax({
    xhr: function() {
        var xhr = jQuery.ajaxSettings.xhr();
        if(xhr instanceof window.XMLHttpRequest) {
            xhr.upload.addEventListener('progress', on_progress, false);
            xhr.upload.addEventListener('load', on_loaded, false);
            xhr.addEventListener('abort', on_abort, false);
        }
        return xhr;
    }
});

这里只对$.ajax中的xhr对象做了upload属性的包装，其实可以利用$.ajaxSetup，完成对全局$.ajax默认参数的设定

比如$.ajaxSetup({"type" : 'POST'})，默认的ajax就都是post啦~

不得不说，jquery的api，太人性化了~~

参考：http://stackoverflow.com/questions/4915671/how-to-get-pure-xmlhttprequest-object-in-jquery-1-5?lq=1

转载于:https://www.cnblogs.com/sodawy/archive/2013/05/27/3101642.html