jquery文件验证器：如何在成功时调用函数？ [英] Jquery file validator : How to call a function on success?
本文介绍了jquery文件验证器：如何在成功时调用函数？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在使用jquery文件验证器插件。
以下是链接：
http：// adamsanderson.github.io/jQuery-File-Validator/#documentation
我可以在验证之前调用一个函数和 onInvalid 输入。
但是有人能告诉我如果文件是有效的输入，我怎么能调用函数？
这里是代码..
$（el）.fileValidator（{
onValidation：function（files）{/ *在验证文件前调用一次* /}，
onInvalid：function（validationType，file）{/ *为每个无效文件调用一次* /}，
maxSize：'2m'，//可选
类型：'image'//可选
}）;
解决方案
好的，需要对插件，我不会详细讨论，因为这些更改会传播到整个文件中，但这里是您需要的版本：
/ **
上传文件，只是发现它们太大，或者错误的类型令人沮丧。
`fileValidator`插件允许您在用户开始上传
巨大文件之前发出警告。
用法
-----
只需选择您想要验证的文件输入，并传入回调以处理无效文件。
$（el）.fileValidator（{
onValidation：function（files）{...}，
onInvalid：function（validationType，file）{...}，
maxSize：'2m'，//可选
类型：'image'//可选
}）;
$ b $ /
（函数（$）{
validFile = true;
$。 fileValidator = function（options）{
var validations = [];
var onInvalid = options.onInvalid;
var onValid = options.onValid;
$ for $（$ .fileValidator.validations）{
if（！options [key]）{continue;}
validations.push（$ .fileValidator.validations [key]（options [key] ，onInvalid，onValid））;
}
return function（file）{
for（var i = 0，len = validations.length; i< len; i ++）{
validations [i] .call（this，file）;
}
if（validFile）{onValid.call（）;}
};
$;
$ .fileValidator.validations = {
maxSize：function（maxSize，invalid，valid）{
if（typeof maxSize =='string'）{
maxSize = $ .fileValidator.sizeToBytes（maxSize）;
}
返回函数（文件）{
if（file.size> maxSize）{i nvalid.call（此， MAXSIZE，文件）; validFile = false; }
};
}，
类型：函数（contentType，无效，有效）{
var isValid;
if（typeof contentType =='function'）{
isValid = contentType;
} else if（contentType.constructor === RegExp）{
isValid = function（type）{return type.match（contentType）; };
} else {
isValid = function（type）{return〜type.indexOf（contentType）; };
}
返回函数（文件）{
if（！isValid（file.type））{invalid.call（this，'type'，file）; validFile = false; }
};
}
};
$ .fn.fileValidator = function（userOptions）{
var options = $ .extend（{
// Validations
maxSize：null，
类型：null，
//回调
onValidation：$ .fileValidator.doNothing，
onInvalid：$ .fileValidator.doNothing，
onValid：$ .fileValidator.doNothing
}，userOptions）;
return this.each（function（）{
var el = $（this）;
var validator = $ .fileValidator（$ .extend（{}，options，el .data（）））;
el.bind（'change'，function（event）{
var files = this.files || [];
options.onValidation .call（this，files）;
for（var i = 0，len = files.length; i< len; i ++）{
validator.call（this，files [i]）;
}
}）;
}）;
};
$ .fileValidator.doNothing = function doNothing（）{};
$ .fileValidator.sizeToBytes = function sizeToBytes（size）{
var scale = 1; （〜size.indexOf（'k'））{
scale = 1024;
if
} else if（〜size.indexOf（'m'））{
scale = 1024 * 1024;
} else if（〜size.indexOf（'g'））{
scale = 1024 * 1024 * 1024;
}
return parseInt（size，10）* scale;
};
}）（jQuery）;
像这样使用它：
<$ p $ （）{$ b $（'input'）。fileValidator（{
onValidation：function（）{validFile = true;}，
onInvalid： function（type，file）{alert（'Error：'+ type）;}，
onValid：function（）{alert（'Yay！'）;}，
type：'image'，
maxSize：'1m'
}）;
}）;
编辑
JS Fiddle Demo
code> validFile 变量从一开始就是true，如果遇到错误，它就会变成false。I am using jquery file validator plugin.
Here is the link :
http://adamsanderson.github.io/jQuery-File-Validator/#documentation
I can call a function before validation and onInvalid input.
But can someone tell me how can i call a function if file is a valid input?
Here is the code..
$( el ).fileValidator({
onValidation: function(files){ /* Called once before validating files */ },
onInvalid: function(validationType, file){ /* Called once for each invalid file */ },
maxSize: '2m', //optional
type: 'image' //optional
});
解决方案
Ok, a few changes need to be done to the plugin, I will not go into details as theses changes are spread in the entire file, but here is the version you need:
/**
Uploading files, only to find that they are too large, or the wrong type is frustrating.
The `fileValidator` plugin lets you warn users before they start uploading
enormous files.
Usage
-----
Simply select the file inputs you wish to validate, and pass in a callbacks to handle invalid files.
$( el ).fileValidator({
onValidation: function(files){ ... },
onInvalid: function(validationType, file){ ... },
maxSize: '2m', //optional
type: 'image' //optional
});
*/
(function($){
validFile = true;
$.fileValidator = function(options){
var validations = [];
var onInvalid = options.onInvalid;
var onValid = options.onValid;
for (var key in $.fileValidator.validations){
if (!options[key]){ continue; }
validations.push( $.fileValidator.validations[key](options[key], onInvalid, onValid));
}
return function(file){
for(var i=0, len = validations.length; i < len; i++){
validations[i].call(this, file);
}
if(validFile){onValid.call();}
};
};
$.fileValidator.validations = {
maxSize: function(maxSize, invalid, valid){
if( typeof maxSize == 'string' ){
maxSize = $.fileValidator.sizeToBytes(maxSize);
}
return function(file){
if (file.size > maxSize){ invalid.call(this,'maxSize',file); validFile = false; }
};
},
type: function(contentType, invalid, valid){
var isValid;
if( typeof contentType == 'function' ){
isValid = contentType;
} else if (contentType.constructor === RegExp ) {
isValid = function(type){ return type.match(contentType); };
} else {
isValid = function(type){ return ~type.indexOf(contentType); };
}
return function(file){
if (!isValid(file.type)) { invalid.call(this,'type', file); validFile = false; }
};
}
};
$.fn.fileValidator = function(userOptions) {
var options = $.extend({
// Validations
maxSize: null,
type: null,
// Callbacks
onValidation: $.fileValidator.doNothing,
onInvalid: $.fileValidator.doNothing,
onValid: $.fileValidator.doNothing
}, userOptions);
return this.each(function() {
var el = $(this);
var validator = $.fileValidator( $.extend({}, options, el.data()) );
el.bind('change', function(event){
var files = this.files || [];
options.onValidation.call(this, files);
for(var i=0, len=files.length; i < len; i++){
validator.call(this, files[i]);
}
});
});
};
$.fileValidator.doNothing = function doNothing(){};
$.fileValidator.sizeToBytes = function sizeToBytes(size){
var scale = 1;
if (~ size.indexOf('k')){
scale = 1024;
} else if (~ size.indexOf('m')){
scale = 1024 * 1024;
} else if (~ size.indexOf('g')){
scale = 1024 * 1024 * 1024;
}
return parseInt(size,10) * scale;
};
})( jQuery );
Use it like this:
$(function(){
$('input').fileValidator({
onValidation : function(){ validFile=true; },
onInvalid: function(type, file){ alert('Error: '+type); },
onValid : function(){ alert('Yay!'); },
type: 'image',
maxSize: '1m'
});
});
Edit
The validFile variable is true from the beginning, and if it meets an error, it becomes false.
这篇关于jquery文件验证器：如何在成功时调用函数？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
