使用jQuery验证检查图像大小不起作用

问题描述：

我正在将图像上传到文件夹，但是在上传之前，我正在检查图像的扩展名和大小.我正在使用jQuery验证.

I am uploading an image to the folder but before uploading, I am checking the image extension and size. I am using jQuery validation.

我在上传问题之前检查了SO，然后找到了代码.但是问题是当我上传的图像小于100kb(实际图像大小为98kb)时，出现错误"File size must be less than 5".我尝试了另一张3.8MB的图片，但仍然收到相同的错误.

I checked on SO before uploading the question and I found the code. But the issue is when I am uploading an image which is less than 100kb(actual image size is 98kb) then I am getting the error "File size must be less than 5". I tried another image which is 3.8MB but still getting the same error.

您能帮我在这里使用多少尺寸的图像?什么是文件大小:5?

Would you help me out what size of the image I have to use here? and what is the filesize: 5?

有人可以帮我解决这个问题吗?

Can any one help me out in this issue?

$.validator.addMethod('filesize', function(value, element, param) {
  return this.optional(element) || (element.files[0].size <= param)
}, 'File size must be less than {0}');

$(function($) {
  "use strict";
  $('#form').validate({
    rules: {
      image: {
        //required: true,
        extension: "jpg,jpeg,png",
        filesize: 5,
      }
    },
  });
});

<form id="form" method="post" action="">
  <input type="file" name="image" />
  <input type="submit" value="Upload" />
</form>

<script type="text/javascript" src="//code.jquery.com/jquery-1.11.3.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.13.1/jquery.validate.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.13.1/additional-methods.js"></script>

答

您的参数仅设置为5

$('#form').validate({
    rules: {
      image: {
        ....
        filesize: 5,  ...

即5个 BYTES ，因此，对于任何大小为98 kB或3.8 MB的文件，您都会收到错误消息.由于它们都大于5个字节，因此它们将无法通过您的自定义规则，该规则仅允许文件小于小于5个字节.

That is 5 BYTES, so of course you would be getting the error message for any file that is 98 kB or 3.8 MB. Since these are both larger than 5 bytes, they fail your custom rule, which only allows files smaller than 5 bytes.

如果要允许5 MB以下的文件，请尝试5242880.

Try 5242880 if you want to allow files under 5 MB.

filesize: 5242880 // <- 5 MB

$.validator.addMethod('filesize', function(value, element, param) {
  return this.optional(element) || (element.files[0].size <= param)
}, 'File size must be less than {0} bytes');

$(function($) {
  "use strict";
  $('#form').validate({
    rules: {
      image: {
        //required: true,
        extension: "jpg,jpeg,png",
        filesize: 5242880 // <- 5 MB
      }
    },
  });
});

<form id="form" method="post" action="">
  <input type="file" name="image" />
  <input type="submit" value="Upload" />
</form>

<script type="text/javascript" src="//code.jquery.com/jquery-1.11.3.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.13.1/jquery.validate.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.13.1/additional-methods.js"></script>

使用jQuery验证检查图像大小不起作用

相关推荐