blueimp jquery-file-upload 在添加失败时不会抛出错误

Question

在这个插件中，我们可以设置文件上传的各种条件/限制（例如acceptFileTypes、maxFileSize、maxNumberOfFiles等）

每当添加文件时，都会触发一个事件“fileuploadadd”，一旦成功添加文件，就会触发另一个事件“fileuploadadd”。

然而，当一个文件被添加并且它没有满足这些条件/限制之一时（例如，用户试图上传 2GB 的文件，或文本文件而不是图像），就无法通过编程方式找出发生了这种情况。

当此条件失败时，不会触发任何事件。我可以用什么来检查用户选择的文件是否有错误，因此没有被添加到队列中。

我能想到的唯一方法是它触发一个“add”事件并等待，看看它是否没有触发“added”事件那么就有问题了.但是，我既不想长时间停止所有处理，也不想太快检查“added”事件是否已触发。

或

谁能指导一下如何从这个插件中抛出一个自定义事件（例如fileaddfailedevent）？

Answer 1

好吧，我想出了一种方法来触发这个需求的自定义事件。如果有人想知道如何实现相同的目标，请在此处发布答案。

我们需要修改的核心文件应该位于“js\jquery.fileupload-ui.js”

在 add 回调中 add: function (e, data) { 最后一个监听器是 }).fail(function () { 。这应该大约在第 120 行（取决于版本）

我们需要添加以下行：
that._trigger('addfileerror', e, data);

总结一下你的失败监听器应该如下所示：

}).fail(function () {
if (data.files.error) {
    data.context.each(function (index) {
        var error = data.files[index].error;
        if (error) {
            $(this).find('.error').text(error);
        }
    });
    // added custom event to check whether any error has occured while adding the file.
    that._trigger('addfileerror', e, data); 
}
})

现在我们可以像绑定任何其他侦听器一样绑定侦听器来检查此事件。

$('#fileupload').bind('fileuploadaddfileerror', function (e, data){
    console.log('Custom Error Event Fired');
});

希望这对某人有所帮助。

更新：

尽管文档没有明确提及，但我刚刚了解到“fileuploadprocessfail”事件对上述要求的作用完全相同。