完成所有上传后的FineUploader客户端事件

Question

我实现了FineUploader,我希望在上传所有文件后将我的客户端脚本连接到一个事件.那可能吗？

我的实现如下.只是想知道这是否是正确的方向.

    function init() {
    var uploader = new qq.FineUploader({
        element: document.getElementById('button-selectfiles'),
        request: {
            endpoint: '/Up/UploadFile'
        },

        callbacks: {
            onStatusChange: onFileUploadStatusChange
        }
    });
};

var uploads = 0;
function onFileUploadStatusChange(id, oldStatus, newStatus) {
    console.log(newStatus);

    if (newStatus === 'submitting') {
        uploads++;
    }

    if (newStatus === 'upload successful' || newStatus === 'upload failed') {
        uploads--;
    }

    if (uploads === 0) {

        console.log('done');
    }
}

Answer 1

onComplete- 用于单个上传文件,如果您使用多个文件上传,只需使用onAllComplete:

callbacks: {
    onAllComplete: function() {
        alert('done')
    }
}

Answer 2

您的onFileUploadStatusChange功能无法检查已取消的文件.

验证是否已上传所有文件的方法是通过API方法:getInProgress和getUploads.如果我们正在进行0次上传,0次上传失败,那么我们可以放心地假设所有文件都已上传.如果您仍希望继续上传任何上传失败,则可能需要删除对上传失败的检查.我们检查的过程中要满足这些条件onStatusChange和onComplete回调.该onStatusChange事件应仅检查文件是否已被取消,因为这可能意味着所有其他文件都已完成,因此可以完成自定义操作.

注意:我已经调整了16989719的答案,适用于非jQuery Fine Uploader.

function init() {
    var uploader;

    function check_done() {
    // Alert the user when all uploads are completed.
    // You probably want to execute a different action though.
        if (allUploadsCompleted() === true) {
            window.alert('All files uploaded');
        } 
    }

    function allUploadsCompleted() {
        // If and only if all of Fine Uploader's uploads are in a state of 
        // completion will this function fire the provided callback.

        // If there are 0 uploads in progress...
        if (uploader.getInProgress() === 0) {
            var failedUploads = uploader.getUploads({ status: qq.status.UPLOAD_FAILED });
            // ... and none have failed
            if (failedUploads.length === 0) {
                // They all have completed.
                return true;
            }
        }        
        return false;
    }

    uploader = new qq.FineUploader({
        element: document.getElementById('button-selectfiles'),
        request: {
            endpoint: '/Up/UploadFile'
        },
        callbacks: {
            onStatusChange: function (id, oldStatus, newStatus) {
                // This will check to see if a file that has been cancelled
                // would equate to all uploads being 'completed'.
                if (newStatus === qq.status.CANCELLED) {
                    check_done();
                }     
            },
            onComplete: check_done
        }
    });
};