Jquery文件上传插件：如何验证添加的文件？

---

如何在不超时的情况下获取属性

data.files.valid的布尔值？
以下是您要执行的操作：

$('#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);
    })
;

核心jquery.fileupload.js文件正在添加您的文件并触发“fileuploadadd”事件，但这是在验证文件之前

文件jquery.fileupload-ui.js在添加文件后执行验证，并在完成后触发另一个“fileuploadadded”事件

改变活动，你就一切就绪

请注意:
该答案自2013年3月发布之日起有效。从那以后，这个上传插件似乎已经改变了。这意味着出现了一个新问题，你应该发布一个新问题（或者搜索看看是否有人已经有了问题），而不是否决这个问题
我需要使用当前版本的插件（5.39.1）进行验证，这对我来说很有用：

确保在初始化脚本之后和之前按此顺序包括和

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

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

所有验证都是可选的，只是不要将不需要的验证保留为未定义的。
好吧，@jszbody的答案就是完美的答案

但是，如果有人来到这里寻找类似问题的解决方案，用户希望知道文件是否添加不正确，我也会这样做

这就是我所做的，它适用于我的新版本：
我为每种类型的文件及其大小创建了一个验证

$('.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);
    }
  });

$（“#fileUploadArea”）.fileupload({
数据类型：“json”，
url:“${upload}”，
多重：对，
自动提交：false，
maxNumberOfFiles:Number（“${QuantidaDemaximaArquivosPload}”），
dynamicFormData:function（）
{
变量数据={
idEntidadeEmpresarial:$（“#idEntidadeEmpresarial”）.val（），
idDominioFamilia:$（'#idDominioFamilia'）.val（），
idSubgrupo:$（'select[id^=“subgrupo_950;”）.map（函数（）{return$（this.val（）；}）.get（），
descripcao:$（'#descripcao'）.val（），
validade:$（'#validade'）.val（）
}
返回数据；
},
标题：{
接受：“应用程序/json”
},
接受：'application/json'，
图像最大宽度：800，
图像最大高度：800，
是的，
停止：函数（）{
$.unbui（）；
如果（$（'#fechar'）。为（“：选中”））{
window.close（）；
}否则{
$（'select[id^=“subgrupo_'）。每个（函数（）{
$（this.val（“”）；
$（此）.trigger（“已选择：已更新”）；
})
$（'validade'）.val（''）；
$（'#descripcao'）.val（''）；
$（'#sucesso'）.html（''）；
$（'sucesso'）。追加（'p>'）；
$（'sucesso'）.show（）；
}
},
错误：函数（文件、状态、errMsg）
{
$（'#erro'）.html（''）；
$（'#erro'）。追加（''+errMsg+'
'）；
$（'#erro'）.show（）；
},
acceptFileTypes:${listaExtensaoPermitidas}
}).on（'fileuploadprocessalways'，函数（e，数据）{
var currentFile=data.files[data.index]；
var tamanho=currentFile.size；
var extensao=currentFile.name.substring（currentFile.name.lastIndexOf（“.”+1，currentFile.name.length）；
if（hashExtensao.get（extensao.toUpperCase（））
这就是您希望对更新版本的插件（9.11.2）执行的操作：
包括此文件：

-jquery.ui.widget.js

-jquery.iframe transport.js

-jquery.fileupload.js

-jquery.fileupload process.js

-jquery.fileupload-validate.js

$("#fileUploadArea").fileupload({
        dataType: 'json',
        url:'${upload}',
        multiple:true,
        autoSubmit:false,
        maxNumberOfFiles: Number('${quantidadeMaximaArquivosUpload}'),
        dynamicFormData: function()
        {
            var data ={ 
                    idEntidadeEmpresarial: $('#idEntidadeEmpresarial').val(),
                    idDominioFamilia: $('#idDominioFamilia').val(),
                    idSubgrupo: $('select[id^="subgrupo_').map(function(){return $(this).val();}).get(),
                    descricao: $('#descricao').val(),
                    validade: $('#validade').val()
            }
            return data;
        },
        headers: {
            Accept: "application/json"
        },
        accept: 'application/json',        
        imageMaxWidth: 800,
        imageMaxHeight: 800,
        imageCrop: true ,
        stop: function(){
            $.unblockUI();
            if($('#fechar').is(":checked")){
                window.close();
            }else{
                $('select[id^="subgrupo_').each(function(){
                    $(this).val('');
                    $(this).trigger("chosen:updated");
                })
                $('#validade').val('');
                $('#descricao').val('');
                $('#sucesso').html('');
                $('#sucesso').append('<p><spring:message code="upload.sucesso"/>');
                $('#sucesso').show();
            }
        },
        error: function(files,status,errMsg)
        {
            $('#erro').html('');
            $('#erro').append('<p>'+errMsg+'</p>');
            $('#erro').show();
        },
        acceptFileTypes : ${listaExtensaoPermitidas}
    }).on('fileuploadprocessalways', function (e, data) {
        var currentFile = data.files[data.index];

        var tamanho = currentFile.size;
        var extensao = currentFile.name.substring(currentFile.name.lastIndexOf(".") +1,currentFile.name.length);            

        if(hashExtensao.get(extensao.toUpperCase()) < tamanho){
            alert("file type max size "+hashExtensao.get(extensao.toUpperCase());
            data.abort();
        }

    });

我认为使用add方法是可能的

$('#fileupload')
.fileupload({
    acceptFileTypes: /(\.|\/)(jpg)$/i
})
.on('fileuploadadd', function (e, data) {
    console.log('validation object not available at this point. Do not do submit here');
})
.on('fileuploadprocessalways', function (e, data) {
    console.log(data.files.error);//true if error
    console.log(data.files[0].error);//error message
    if(!data.files.error) data.submit(); //do submission here
});

你的提琴不工作！如果我尝试访问'fileuploadadded'回调中的data.files.valid，我会得到未定义的…提琴不工作，因为包含的js文件在加载路径中不再可用（404）。正确设置后，当前版本仍然无法使用此插件，但可能曾经使用过。我发布此答案时，它确实有效。如果此插件的最新版本无法使用此插件，则会出现新问题。请发布新问题，不要否决此答案。它返回
未定义的
：（在
fileuploadprocessfail
上绑定也可以。谢谢！无法让验证/处理工作，即将编写一些疯狂的自定义验证（正如我看到其他人所做的那样）。但只需包含适当的必需文件即可。不确定在发布此评论后是否有其他更新，但最新版本（9.11.2）再次需要不同的方法来实现验证：-如前所述添加两个文件：1）jquery.fileupload-process.js 2）添加jquery.fileupload.js后添加jquery.fileupload.js-将验证配置添加为processQueue，例如：
processQueue:[{action:'validate'，acceptFileTypes:'..}，{action:'validate'，maxFileSize:'..}]
很抱歉更新了最新版本。我编辑了我的帖子以澄清这一点。奇怪的是，当我添加processQueue时，即使使用[]值，我的调整大小也不再触发…而验证开始使用它。我希望这两个都能起作用：/
    var fileUploadInit = function() {
    $("#file-upload-form").fileupload({
        dataType: "json",
        url: url,
        add: function (e, data){
            if(validatefunction(data)){
                data.submit();
            } else {
                return false;
            }
        },
        progressall: function (e, data) {
            var progress = parseInt(data.loaded / data.total * 100, 10);
            $('#upload-progress').css('width',progress + '%');
        },
        done: function(e, data) {
            debugger
        },
        processfail: function(e, data){
            debugger
        }

    })
}
var validatefunction = function(data){
    // Do validation here. Return true if everything is correct else return                 false
}