在使用JavaScript上传文件之前,有什么方法可以检查文件大小?
当前回答
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>
其他回答
尽管问题已经有了答案,我还是想把我的答案贴出来。可能对以后的观众有用。您可以像下面的代码中那样使用它。
document.getElementById("fileinput").addEventListener("change",function(evt) { //Retrieve the first (and only!) File from the FileList object var f = evt.target.files[0]; if (f) { var r = new FileReader(); r.onload = function(e) { var contents = e.target.result; alert("Got the file\n" + "name: " + f.name + "\n" + "type: " + f.type + "\n" + "size: " + f.size + " bytes\n" + "starts with: " + contents.substr(1, contents.indexOf("\n")) ); if (f.size > 5242880) { alert('File size Greater then 5MiB!'); } } r.readAsText(f); } else { alert("Failed to load file"); } }) <input type="file" id="fileinput" />
适用于动态和静态文件元素
仅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">
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>
如果你正在使用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.'
);
这很简单。
const oFile = document.getElementById("fileUpload").files[0]; // <input type="file" id="fileUpload" accept=".jpg,.png,.gif,.jpeg"/>
if (oFile.size > 2097152) // 2 MiB for bytes.
{
alert("File size must under 2MiB!");
return;
}