Question

我正在尝试使用fineUploader，但我遇到了一个问题。这个问题真的是因为我对jQuery并不熟悉，所以如果这是一个愚蠢的问题，我很抱歉。

以下是我的代码。我想fadeOut在fineUploader中成功加载的每一行，以便在上传结束时，所有出现的内容都是原始上传按钮或上传失败。如果您上传1000个文件，它看起来非常俗气，每个上传的图像有1000行绿色框。我喜欢Uploadify的工作方式，而每一行在最后上传时都会慢慢淡出，没有上传图像的行。谁能为我建议一个解决方案？谢谢！

This is the container which jQuery loads each success or failed row into...
<ul id="basicUploadFailureExample" class="unstyled"></ul>

$(document).ready(function() {
var errorHandler = function(event, id, fileName, reason) {
    qq.log("id: " + id + ", fileName: " + fileName + ", reason: " + reason);
};

var uploader3 = new qq.FineUploader({
    element: $('#basicUploadFailureExample')[0],
    callbacks: {
        onError: errorHandler,
        onComplete: function(id, fileName, responseJSON) {
            if (responseJSON.success == true) {
                            // I would think the fade out would go here but I am just not sure... 
            } 
        }
    },
    request: {
        endpoint: "../server/php/example.php",
        params: {"generateError": true}
    },
    failedUploadTextDisplay: {
        mode: 'custom',
        maxChars: 5
    }
});

}）;

Answer 1

实际上，这很容易做到，而且你有正确的想法，你只是缺少一个关键的API函数。

您的代码应该如下所示（只需要添加/更改一行）：

var uploader3 = new qq.FineUploader({
    element: $('#basicUploadFailureExample')[0],
    callbacks: {
        onError: errorHandler,
        onComplete: function(id, fileName, responseJSON) {
            if (responseJSON.success == true) {
               $(this.getItemByFileId(id)).hide('slow');
            } 
        }
    },
    request: {
        endpoint: "../server/php/example.php",
        params: {"generateError": true}
    },
    failedUploadTextDisplay: {
        mode: 'custom',
        maxChars: 5
    }
});

我添加到onComplete处理程序的一行调用getItemByFileId函数，该函数返回包含UI中显示的文件详细信息的元素。只需隐藏它，或在其上执行一些其他动画，最终隐藏它。

顺便说一句，我认为这是一个很酷的主意（淡出所有但上传失败）。

FineUploader淡出每一行

1 个答案: