我正在尝试使用jQuery Validate验证HTML文件上传
我发现我可以使用meta选项,如:
$("#myform").validate({
meta: "validate"
})
<input type="file" name="upload" class="{validate:{required:true,accept:'docx?|pdf'}}" />
但它似乎不起作用。无论如何我需要添加required
类。那么文件类型检查当然也不会起作用。我需要做些额外的事吗?
答案 0 :(得分:65)
如果您想使用jQuery的validate
来检查文件的大小,可以执行以下操作:
1-加载其他方法文件
<script src="http://cdn.jsdelivr.net/jquery.validation/1.15.0/additional-methods.min.js"></script>
2-添加自定义方法以验证文件大小
$.validator.addMethod('filesize', function(value, element, param) {
// param = size (in bytes)
// element = element to validate (<input>)
// value = value of the element (file name)
return this.optional(element) || (element.files[0].size <= param)
});
3-使用新添加的方法作为验证规则来验证您的输入:
$('#formid').validate({
rules: { inputimage: { required: true, extension: "png|jpe?g|gif", filesize: 1048576 }},
messages: { inputimage: "File must be JPG, GIF or PNG, less than 1MB" }
});
注意:上传具有空白文件类型的文件时,使用“接受”验证规则而不是“扩展名”会导致MIME类型错误消息。
答案 1 :(得分:9)
您可以添加验证方法来完成
jQuery.validator.addMethod("uploadFile", function (val, element) {
var size = element.files[0].size;
console.log(size);
if (size > 1048576)// checks the file more than 1 MB
{
console.log("returning false");
return false;
} else {
console.log("returning true");
return true;
}
}, "File type error");
并像这样使用它 -
$(document).ready(function(){
$('#quote_form').validate({
rules: {
image: {
required: true,
extension:'jpe?g,png',
uploadFile:true,
}
}
});
});
我希望这会对你有帮助..
答案 2 :(得分:2)
您是否以这种方式阅读并尝试过:http://docs.jquery.com/Plugins/Validation/Methods/accept#extension?
我的意思是,如果您尝试立即将它们添加到验证初始化中,而不是将验证规则添加到类中?