在提交表单之前validation文件扩展名和大小
我正在使用jQuery validate插件，并希望在提交表单之前validation文件扩展名和文件大小。
"use strict"; $('#update_profile').validate({ rules: { FirstName: { required: true, maxlength: 20 }, image: { required: true, extension: "jep | jpeg", filesize : 50000, } } }); 我想要类似于上面的代码。
您需要编写自定义规则来validation文件大小，文件扩展名也必须以逗号分隔的字符串forms传递
$.validator.addMethod('filesize', function (value, element, param) { return this.optional(element) || (element.files[0].size <= param) }, 'File size must be less than {0}'); jQuery(function ($) { "use strict"; $('#update_profile').validate({ rules: { FirstName: { required: true, maxlength: 20 }, image: { required: true, extension: "jpg,jpeg", filesize: 5, } }, }); });
$.validator.addMethod('filesize', function (value, element, arg) { var minsize=1000; // min 1kb if((value>minsize)&&(value<=arg)){ return true; }else{ return false; } }); $("#myform" ).validate({ rules: { file_upload:{ required:true, accept:"application/pdf,image/jpeg,image/png", filesize: 200000 //max size 200 kb } },messages: { file_upload:{ filesize:" file size must be less than 200 KB.", accept:"Please upload .jpg or .png or .pdf file of notice.", required:"Please upload file." } }, submitHandler: function(form) { form.submit(); } });
最小1 kb到最大200 kb文件大小并经过测试
$.validator.addMethod('filesize', function (value, element, param) { return this.optional(element) || (element.files[0].size <= param) }, 'File size must be less than {0}'); jQuery(function ($) { "use strict"; $('#update_profile').validate({ rules: { FirstName: { required: true, maxlength: 20 }, image: { required: true, extension: "jpg,jpeg", filesize: 5, } }, }); });
HTML Browse… //Message will display here JQuery $(document).on('change', '.btn-file :file', function() { var input = $(this),numFiles = input.get(0).files ? input.get(0).files.length : 1, label = input.val().replace(/\\/g, '/').replace(/.*\//, ''); var msg = "spanUploadFile"; input.trigger('fileselect', [numFiles, label]); genrateFileMsg(this.id, msg) genrateSizeMsg(this.files[0], msg) }); function genrateFileMsg(id, nId) { var fileExtension = ['jpeg', 'jpg', 'png', 'gif', 'bmp']; var fileExtensionDOB = ['pdf']; //var fileExtensionDOB = ['pdf', 'doc', 'docx', 'txt', ]; if ($.inArray($("#" + id).val().split('.').pop().toLowerCase(), fileExtension) == -1) { $("#" + nId).html("Only files of type jpg, png, gif, jpeg is allowed"); return false; } return true } function genrateSizeMsg(f, nId) { var f = f.size; f = f / 1024; if (f > 100) { $("#" + nId).html("The file you are trying to upload is too large (max 100KB)"); return false; } return true; }