AJAX上传附件实时返回上传进度

在ajax调用中使用XMLHttpRequest.upload监听上传过程，progress事件，输出回调函数中的event事件

示例代码如下：

    function uploadFile() {
        var data = new FormData();
        data.append('file', $("#uploadvideo").prop("files")[0]);   //file控件

        $.ajax({
            type: "post",
            url: "UploadVideo_Upload",
            data: data,
            //async: false,//同步上传
            //cache: false,//上传文件无需缓存
            processData: false,  // 不处理数据
            contentType: false, // 不设置内容类型
            success: function (data) {
                if (data == "success") {
                    $("#a-upload").remove();
                    $("#td_upload").html("上传成功，请等待审核。");
                    $("#td_error").html("");
                } else {
                    alert(data);
                }
            },
            error: function (data) {
                alert('请求失败，请刷新页面重试。');
            },
            xhr: function () {
                var xhr = new XMLHttpRequest();
                //使用XMLHttpRequest.upload监听上传过程，注册progress事件，打印回调函数中的event事件
                xhr.upload.addEventListener('progress', function (e) {
                    console.log(e);
                    //loaded代表上传了多少
                    //total代表总数为多少
                    var progressRate = (e.loaded / e.total) * 100;

                    //通过设置进度条的宽度达到效果
                    $("#span_upload").html("正在上传中，已完成 " + progressRate.toFixed(2) + "%");
                })

                return xhr;
            }
        });
    }