js如何获取文件上传进度?

js如何获取文件上传进度?

 

 js监听:

var xhrOnProgress=function(fun) {

      xhrOnProgress.onprogress = fun; //绑定监听

      //使用闭包实现监听绑

      return function() {

        //通过$.ajaxSettings.xhr();获得XMLHttpRequest对象

        var xhr = $.ajaxSettings.xhr();

        //判断监听函数是否为函数

        if (typeof xhrOnProgress.onprogress !== ‘function‘)

          return xhr;

        //如果有监听函数并且xhr对象支持绑定时就把监听函数绑定上去

        if (xhrOnProgress.onprogress && xhr.upload) {

          xhr.upload.onprogress = xhrOnProgress.onprogress;

        }

        return xhr;

      }

}

ajax文件上传函数:

function Submit(){

 

         var fileObj = document.getElementById("FileUpload").files[0]; // js 获取文件对象

         var formFile = new FormData();

          

         formFile.append("file", fileObj); //加入文件对象

         

          var data = formFile;

          $.ajax({

                   url: url,

                   data: data,

                   type: "Post",

                   dataType: "json",

                   cache: false,//上传文件无需缓存

                   processData: false,//用于对data参数进行序列化处理 这里必须false

                   contentType: false, //必须

                   xhr:xhrOnProgress(function(e){

                      var percent=e.loaded/e.total;//文件上传百分比

                      console.log(percent);

                   }),

                   success: function (result) {

                       console.log(result);

                   },

               })

    }

 

核心代码:

 xhr:xhrOnProgress(function(e){

                      var percent=e.loaded/e.total;//文件上传百分比

                      console.log(percent);

                   }),

 

js如何获取文件上传进度?

上一篇:《数字视频和高清:算法和接口》一1.8数字图像的表示方法


下一篇:使用 PHP 与 NTP 服务器同步时间(Port=123/UDP)