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
        }
    });
};

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

2 个答案: