Jquery文件上传插件:如何在添加时验证文件？

Question

$('#fileupload')
    .fileupload({
        acceptFileTypes: /(\.|\/)(jpg)$/i
    })
    .on('fileuploadadd', function (e, data) {
        console.log(data.files.valid); //undefined
        setTimeout(function () {
            console.log(data.files.valid); //true or false
        }, 500);
    })
;

jsFiddle

如何在data.files.valid没有超时的情况下获取属性的布尔值？

Answer 1

我需要使用当前版本的插件(5.39.1)进行验证,这对我有用:

一定要包括jquery.fileupload-process.js和jquery.fileupload-validate.js 顺序之后 jquery.fileupload.js和之前您的初始化脚本.

在初始化脚本中添加验证选项并在fileuploadprocessalways回调中检查验证:

$('.fileinput').fileupload({
    // The regular expression for allowed file types, matches
    // against either file type or file name:
    acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
    // The maximum allowed file size in bytes:
    maxFileSize: 10000000, // 10 MB
    // The minimum allowed file size in bytes:
    minFileSize: undefined, // No minimal file size
    // The limit of files to be uploaded:
    maxNumberOfFiles: 10
  }).on('fileuploadprocessalways', function (e, data) {
    var currentFile = data.files[data.index];
    if (data.files.error && currentFile.error) {
      // there was an error, do something about it
      console.log(currentFile.error);
    }
  });

所有验证都是可选的,只是不要留下你不需要的验证undefined.

Answer 2

这是你想要做的:

$('#fileupload')
    .fileupload({
        acceptFileTypes: /(\.|\/)(jpg)$/i
    })
    .bind('fileuploadadded', function (e, data) {
        console.log(data.files.valid);
    });

核心jquery.fileupload.js文件正在添加文件并触发"fileuploadadd"事件,但这是在验证文件之前.

文件jquery.fileupload-ui.js在添加文件后进行验证,并在完成后触发另一个"fileuploadadded"事件.

改变事件,你就完成了.

请注意:

这个答案是有效的,截止日期为2013年3月.从那时起,这个上传插件似乎已经发生了变化.这意味着存在一个新问题,你应该发布一个新问题(或搜索以查看某人是否已经拥有)而不是向下投票!