jquery文件上传的全局开始/结束事件

Global start/end events for jquery file upload

本文关键字：开始 结束 事件 全局 文件 jquery      更新时间：2023-09-26

我正在阅读jQuery文件上传(API选项)的文档，并且似乎没有表示"我正在开始"answers"我完成了"的事件。有开始和停止，但它们是在每次执行文件上传时调用的。

有没有人知道一个事件，我只是没有看到，或有一个建议如何模拟全局启动/停止操作?

您可以使用progressall:

function (e, data) {
    var progress = parseInt(data.loaded / data.total, 10);
    if( progress === 1) {
        //done :)
    }
}

其实应该是stop回调函数

stop
Callback for uploads stop, equivalent to the global ajaxStop event (but for file upload requests only).
Example:
function (e) {
    console.log('Uploads finished');
}
https://github.com/blueimp/jQuery-File-Upload/issues/990

最接近全局'开始'的是处理放置/更改/粘贴事件:

$('input[type="file"]').fileupload({
  // config here...
}).bind('fileuploaddrop fileuploadchange fileuploadpaste', function(e, data) {
  console.log('Global start');
});

此处理程序将只触发一次;在用户发起上传之后，在处理文件队列(或任何远程上传)开始之前立即开始。

如果你正在做没有客户端文件验证， @Kamel的答案对于全局'end'工作得很好(正如文档所建议的)。

如果您验证客户端，您可能还需要处理上传导致没有触发ajax上传的情况。我首先记录上传的文件，然后触发'end'，一旦所有文件都被客户端拒绝，或者在ajax上传后成功/失败/中止:

var selectedFiles = [];    
$('#fileUpload').fileupload({
    url: '//jquery-file-upload.appspot.com/',
    //url: '//does.not.exist/',
    dataType: 'json',
    singleFileUploads: true,
    // validate client-side: only allow '.png' files
    acceptFileTypes: /('.|'/)png$/i,
    done: function (e, data) {
        $.each(data.result.files, function (index, file) {
            $('<p/>').text(file.name).appendTo('#files');
        });
    },
    processfail: function (e, data) {
        var currentFile = data.files[0];
        console.log(currentFile.name, 'cannot be uploaded');
        if (data.files.error && currentFile.error) {
            setFileDone(currentFile.name);
        }
    },
    always: function (e, data) {
        setFileDone(data.files[0].name);
    }
}).bind('fileuploaddrop fileuploadchange fileuploadpaste', function(e, data) {
    selectedFiles = data.files.map(function(f) { return f.name; });
    console.log('Global start');
});
var setFileDone = function(fName) {
    selectedFiles.pop(fName);
    if (!selectedFiles.length) {
        console.log('Global end');
    }
};

在jsbin上有一个工作演示:开始和结束将如上所述记录到控制台。

相关文章：