jquery - Valums Ajax Uploader (Mutli) - 检测所有文件何时上传

Question

我正在使用 Valums Ajax Uploader 上传一批文件。我们最近将代码从单一上传类型更改为多重上传类型。这给我们的代码带来了问题。

如您所见，当 onComplete 事件触发时，我们重新加载页面以显示新上传的图像。但是， onComplete 事件似乎是在每个文件完成后触发，而不是在整个批处理完成后触发。现在，这会导致问题，因为当第一个文件完成时，会触发页面重新加载尝试，并且上传者会弹出警报“如果您离开此页面，则剩余的上传将全部崩溃” - 或类似的内容。

我注意到 onComplete 事件发送回已完成文件的基于 0 的 ID，但我不确定如何使用它来确定批处理何时完成。

我想我的问题是 A) 当所有文件完成时是否会触发不同的事件或 B) 如何确定用户选择了多少个文件，以便在 onComplete 事件有多少个文件已完成？

    var uploader = new qq.FileUploader({
        multiple: true,
        element: document.getElementById('file-uploader'),
        action: '/projectPhotoUpload.php',
        allowedExtensions: ['jpg', 'png', 'gif'],
        debug: true,
        params: {id: i},
        onComplete: function(id, fileName, responseJSON){
            window.location = 'projects.php?all=true&tab=1&sel=' + currProject;                                 
        }   
    })  

Answer 1

您可以添加一个计数器，该计数器在上传开始时递增，在完成时递减。仅当计数器为 0 时才重定向完成。

var running = 0;  
var uploader = new qq.FileUploader({
    multiple: true,
    element: document.getElementById('file-uploader'),
    action: '/projectPhotoUpload.php',
    allowedExtensions: ['jpg', 'png', 'gif'],
    debug: true,
    params: {id: i},
    onSubmit: function(id, fileName){
        running++;                                 
    },
    onComplete: function(id, fileName, responseJSON){
        running--;
        if(running==0){
          window.location = 'projects.php?all=true&tab=1&sel=' + currProject;                                 
        }
    }   
})