JavaScript文件上传大小验证

在使用JavaScript上传文件之前，有什么方法可以检查文件大小?

当前回答

如果你正在使用jQuery验证，你可以这样写:

$.validator.addMethod(
  "maxfilesize",
  function (value, element) {
    if (this.optional(element) || ! element.files || ! element.files[0]) {
      return true;
    } else {
      return element.files[0].size <= 1024 * 1024 * 2;
    }
  },
  'The file size can not exceed 2MiB.'
);

2013-04-29 09:10:46

其他回答

我使用了一个主要的Javascript函数，这个函数是我在Mozilla开发者网络站点https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications上找到的，还有一个使用AJAX的函数，并根据我的需要进行了修改。它接收到一个文档元素id，关于在我的html代码中我想写文件大小的地方。

<Javascript>

function updateSize(elementId) {
    var nBytes = 0,
    oFiles = document.getElementById(elementId).files,
    nFiles = oFiles.length;

    for (var nFileId = 0; nFileId < nFiles; nFileId++) {
        nBytes += oFiles[nFileId].size;
    }
    var sOutput = nBytes + " bytes";
    // optional code for multiples approximation
    for (var aMultiples = ["K", "M", "G", "T", "P", "E", "Z", "Y"], nMultiple = 0, nApprox = nBytes / 1024; nApprox > 1; nApprox /= 1024, nMultiple++) {
        sOutput = " (" + nApprox.toFixed(3) + aMultiples[nMultiple] + ")";
    }

    return sOutput;
}
</Javascript>

<HTML>
<input type="file" id="inputFileUpload" onchange="uploadFuncWithAJAX(this.value);" size="25">
</HTML>

<Javascript with XMLHttpRequest>
document.getElementById('spanFileSizeText').innerHTML=updateSize("inputFileUpload");
</XMLHttpRequest>

干杯

2013-07-26 18:22:28

适用于动态和静态文件元素

仅Javascript解决方案

函数validateSize(input) { const fileSize = input.files[0]。Size / 1024 / 1024;// in MiB if (fileSize > 2) { alert('文件大小超过2个MiB'); / / $(文件).val (");//使用Jquery清除 }其他{ //继续｝｝ <input onchange="validateSize(this)" type="file">

2017-06-12 17:24:16

JQuery在这个线程中提供的例子是非常过时的，谷歌没有任何帮助，所以这里是我的修订:

<script type="text/javascript">
  $('#image-file').on('change', function() {
    console.log($(this)[0].files[0].name+' file size is: ' + $(this)[0].files[0].size/1024/1024 + 'Mb');
  });
</script>

2017-08-10 17:48:38

如果你正在使用jQuery验证，你可以这样写:

$.validator.addMethod(
  "maxfilesize",
  function (value, element) {
    if (this.optional(element) || ! element.files || ! element.files[0]) {
      return true;
    } else {
      return element.files[0].size <= 1024 * 1024 * 2;
    }
  },
  'The file size can not exceed 2MiB.'
);

2013-04-29 09:10:46

使用jquery:

$(" #图像文件”)。On ('change'， function() { console.log('This file size is: ' + This .files[0]. log)size / 1024 / 1024 + "MiB"); })； < script src = " https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js " > < /脚本> <form action="upload" enctype="multipart/form-data" method="post"> 上传图片: <input id="image-file" type="file" name="file" /> <input type="submit" value="Upload" /> > < /形式

2012-11-06 11:21:04

JavaScript文件上传大小验证

推荐文章

最新文章

标签