我有一个名为filesize.js
的FileReader JS文件,其中包含getsize()
函数,该函数在发布表单之前检查图像文件的大小以进行客户端验证。<script type="text/javascript" src="js/filesize.js"></script>
filesize.js:
function getsize(){
var oFile = document.getElementById("file").files[0]; // input box with type file;
var reader = new FileReader();
reader.onload = function (e) {
console.log(e.total); // file size
};
reader.readAsDataURL(oFile );
fileSize = oFile.size;
}
当选择要上传的文件,但在通过在输入标记中使用onchange
发布表单之前,该函数运行。<input type='file' name='file' id='file' onchange='getsize();' />
这将获取当前所选文件的大小,因为一次只能上传一个图像。我遇到的问题是getsize()
是异步的,无论我尝试过什么,我都无法将变量fileSize
传递给称为validate()
的单独同步验证函数,该函数需要在使用onsubmit
发布表单之前单独运行。<form name='add' action='process.php' method='post'
enctype='multipart/form-data' onsubmit='return validate()'>
validate()
在允许表单POST和上传图像之前检查几个不同的因素。其中之一是验证当前选择的映像的文件大小是否小于512KB。
您需要使用回调函数。基本上,回调函数是当一段代码完成运行时运行的函数。在您的示例中,您将通过回调函数提交表单。请看这篇文章