为什么Blueimp的jQuery-File-Upload插件没有激活回调？

Question

我正在尝试使用Blueimp的jQuery-File-Upload插件,该插件根据演示看起来很有前途.

这很容易实现:

var $uploadButton = $("#fileop-upload");// <input type="file" id="fileop-upload" [etc] />
$uploadButton.fileupload({
    url : "//domain/path/to/receive-uploaded-files"
});

所选文件上传正常,无需按预期刷新页面,但当然使用这样的最小配置,用户将不会收到任何通知.这是插件的回调会派上用场的地方.

根据文档,有两种方法可以定义回调.例如,add事件(在选择上传文件时触发)可以在原始配置对象中添加,如下所示:

$uploadButton.fileupload({
    add : addFileListener,
    url : "//domain/path/to/receive-uploaded-files"
});

或者:

$uploadButton.bind("fileuploadadd", addFileListener);

但是我发现只有第一种方法有效,第二种方法没有做任何事情.

这是更奇怪的是,没有其他的回调-尤其是progress和start-似乎没有射击不管我如何将它们绑定:

$uploadButton.fileupload({
    add : addFileListener,
    progress : progressListener,
    start : startListener,
    url : "//domain/path/to/receive-uploaded-files"
});

要么

$uploadButton.fileupload({
    add : addFileListener,
    url : "//domain/path/to/receive-uploaded-files"
});
$uploadButton.bind("fileuploadprogress", progressListener");
$uploadButton.bind("fileuploadstart", startListener");

我定义了引用的侦听器函数,并且代码不会报告任何错误或警告.

该.bind方法失败的原因是什么？为什么听众progress或start听众没有激活？

Answer 1

我是jQuery文件上传插件的作者.

我没有解释为什么第三个示例代码中的fileuploadadd事件不会触发.但是,如果覆盖add callback选项,则必须通过调用data参数的submit方法来确保启动文件上载,如添加回调的Options文档中所述(并且还记录在源代码中)插入).

例如,以下代码应打印出不同的回调事件:

$('#fileupload').fileupload({
    add: function (e, data) {
        console.log('add');
        data.submit();
    },
    progress: function (e, data) {
        console.log('progress');
    },
    start: function (e) {
        console.log('start');
    }
}).bind('fileuploadadd', function (e, data) {
    console.log('fileuploadadd');
}).bind('fileuploadprogress', function (e, data) {
    console.log('fileuploadprogress');
}).bind('fileuploadstart', function (e) {
    console.log('fileuploadstart');
});

另请注意,插件是模块化的,UI版本(在下载示例中使用)使用了回调选项,这些选项将被上面的代码覆盖.这就是事件绑定如此有用的原因,因为它允许定义其他回调方法而不会覆盖通过options对象设置的回调.