上传2个或更多文件时ajax的进展

时间:2017-02-15 07:59:00

标签: javascript jquery ajax file

您好我试图上传2个或更多文件,我的问题是我的进度条会说100%因为首先上传的小文件,然后它回到大文件的百分比..我的问题是如何如果我上传了很多文件,我可以取得同样的进展吗?

for (var i = 0, f; f = files.files[i]; i++) {

 $.ajax({

     xhr: function(){
        //upload Progress
        var xhr = $.ajaxSettings.xhr();
        if (xhr.upload) {
            xhr.upload.addEventListener('progress', function(event) {
                var percent = 0;
                var position = event.loaded || event.position;
                var total = event.total;
                if (event.lengthComputable) {
                    percent = Math.ceil(position / total * 100);
                }
                //update progressbar
                $('.bar').width(percent + '%');
            }, true);
        }
        return xhr;
    },
               url: 'https://content.dropboxapi.com/2/files/upload',
               type: 'post',
               data: f,
               processData: false,
               contentType: 'application/octet-stream',
               headers: {
                         "Authorization": "Bearer ACCESS TOKEN",
                         "Dropbox-API-Arg": '{"path": "/'+f.name+'", "mode": "add","autorename": true,"mute": false}'
                         },
               success: function (data) {
               console.log(data);
              app.alert.show('success-message', {
                 level: 'success',
                  messages: 'your file has been upload to Dropbox',
               autoClose: true
                   });
               },
               error: function (data) {
               console.log(data);
               }
               })

               }

1 个答案:

答案 0 :(得分:0)

我认为你应该将每个文件的进度存储在不同的变量(或者可能的变量数组)和写入函数中,这将在更改此变量时更新进度条宽度。