Javascript 没有任何插件Jquery的Ajax文件上传进度

如何在JQuery中获取文件上传的进度，以便我可以更新关于文件上传的状态栏

下面是我在JQuery中使用Ajax上传文件的代码：

         $('button').click(function(e) {
             var formData = new FormData($('#myform')[0]);
               $.ajax({
                  url: 'FileUploadExample',
                  type: 'post',
                  data: formData,
                  async: true,
                  cache: true,
                  contentType: false,
                  processData: false,
                  success: function(returndata) {
                  }
             });

       });

在谷歌搜索这个问题时，我浏览了jquery.form.min.js插件，该插件有选项

uploadProgress

---

如何在不使用JQuery/JavaScript中的任何插件的情况下获得上传进度

使用JQuery xhr元素，如下所示

var formData = new FormData($('#myForm')[0]);
$.ajax({
    url: url,
    type: 'POST',
    xhr: function() {
        myXhr = $.ajaxSettings.xhr();
        if(myXhr.upload){
            myXhr.upload.addEventListener('progress',progressHandlerFunction, false);
        }
        return myXhr;
    },
    data: formData,
    cache: false,
    contentType: false,
    processData: false
});

在progressHandlerFunction中，您可以访问e.loaded和e.total等进度

progressHandlerFunction(e)
{
    console.log(e.total+""+e.loaded);
}

$.ajaxSettings.xhr（）；是真正的XMLHttpRequest元素，在本机JS中，您可以在XMLHttpRequest.upload onProgress事件上绑定一个处理程序，然后您可以获得event.total和event.loaded，每次event.loaded更改值时，progress事件都会触发

• event.total=HTTP请求的总大小
• event.load=当前上载的值

你可以用这个2做任何事情，你可以通过做

---

var percent=Math.round（（event.loaded/event.total）*100）并相应地调整加载条的宽度。
使用JQuery xhr元素，如下所示

var formData = new FormData($('#myForm')[0]);
$.ajax({
    url: url,
    type: 'POST',
    xhr: function() {
        myXhr = $.ajaxSettings.xhr();
        if(myXhr.upload){
            myXhr.upload.addEventListener('progress',progressHandlerFunction, false);
        }
        return myXhr;
    },
    data: formData,
    cache: false,
    contentType: false,
    processData: false
});

在progressHandlerFunction中，您可以访问e.loaded和e.total等进度

progressHandlerFunction(e)
{
    console.log(e.total+""+e.loaded);
}

$.ajaxSettings.xhr（）；是真正的XMLHttpRequest元素，在本机JS中，您可以在XMLHttpRequest.upload onProgress事件上绑定一个处理程序，然后您可以获得event.total和event.loaded，每次event.loaded更改值时，progress事件都会触发


event.total=HTTP请求的总大小
event.load=当前上载的值

你可以用这个2做任何事情，你可以通过做
var percent=Math.round（（event.loaded/event.total）*100）并相应调整加载条宽度。
检查我的答案兄弟。检查我的答案兄弟。