上传带百分比的分段文件

这是我的代码现在显示进度条的方式：

function uploadFunction(fileType){
    //CSRF attribute for spring security
    var token = $("meta[name='_csrf']").attr("content");
    var header = $("meta[name='_csrf_header']").attr("content");
    var formData = new FormData();
    var fileControl = document.getElementById(fileType);
    var length = fileControl.files.length;
    for(var i = 0; i< length; i++){ 
        formData.append('file[]',fileControl.files[i]); 
    } 
    formData.append('idFleet', selectedFleet);
    formData.append('idCar', $("#selectedCar").val());
    if(fileType!='dat')
        formData.append('initialKm', 0);
    else
        formData.append('initialKm', $("#initialKm").val());
    return jQuery.ajax({
        url : 'upload',
        type: 'POST',
        timeout: 0,//unlimited timeout
        contentType: false,
        processData: false,
        data:formData,
        //Catch upload progress
        xhr: function()
          {
            var xhr = new window.XMLHttpRequest();
            //Upload progress
            xhr.upload.addEventListener("progress", function(evt){
              if (evt.lengthComputable) {
                var progress = Math.round((evt.loaded / evt.total) * 100) + '%';
                //Update progress bar and text
                document.getElementById("fileProgressBar").style.width = progress;
                document.getElementById("percentualFile").innerHTML = progress;
              }
            }, false);
            return xhr;
          },
        beforeSend:function(xhr) {
            xhr.setRequestHeader(header, token);
            waitingFile.showPleaseWait();
        },  
        success: function(data,status,xhr){
            //No exception occurred
            if (data.status){   
                //Also the field are right(for e.g. form value)
                if(data.success){
                    //Store information if file is datatable
                    if (fileType=='datatable')
                        $("#datatablePath").val(data.result[0]);
                    notifyMessage(fileType + " has been uploaded!", 'success');
                    uploadResult=true;
                }
                else{
                    //code if there are some error into form for example
                }
            } else {
                notifyMessage(data.result, 'error');
                $('#acquisitionWizard').bootstrapWizard('show',2);//show
                uploadResult=false;
            }
        },
        error: function(xhr,status,e){
            window.location.href = "/DART/500";
        }
    }).complete(function() {
        //add timeout because otherwise user could see a too fast waiting modal
        setTimeout(function(){
            //Reset to 0 progress bar and text
            document.getElementById("fileProgressBar").style.width = "0%";
            document.getElementById("percentualFile").innerHTML = "0%";
            waitingFile.hidePleaseWait();
        }, 1000);
    });
}

我介绍了 xhr：function（） @Roberto在他的回答中是如何建议的。可以使用类似的函数来显示下载进度状态

//Download progress
xhr.addEventListener("progress", function(evt){
  if (evt.lengthComputable) {
    var percentComplete = evt.loaded / evt.total;
    //Do something with download progress
    console.log(percentComplete);
  }
}, false);