我们如何检查文件上传大小验证
[英]how can we check file upload size validation
问题描述
what i am trying to do in my below code i want to check one more condition when file is upload its should be check file size is greater than 10 mb then is show success message and file size is less than 10 mb then its show error message.while uploading the file.
我在下面的代码中尝试做的事情我想在上传文件时再检查一个条件，它应该是检查文件大小是否大于 10 mb，然后显示成功消息，文件大小小于 10 mb，然后显示错误消息.同时上传文件。
in my below code right now what is this i check two condition when file is upload its should check jpeg or png then its show success message and file extension is not jpeg or png then its show error message.so in my below i want to check one more condition file size how can we do that.现在在我下面的代码中这是什么我在上传文件时检查两个条件它应该检查 jpeg 或 png 然后它的显示成功消息和文件扩展名不是 jpeg 或 png 然后它的显示错误消息。所以在我下面我想检查一个条件文件大小我们怎么能做到这一点。
is there any help?有什么帮助吗？
function fileValidation() { var fileInput = document.getElementById('file'); var filePath = fileInput.value; // Allowing file type var allowedExtensions = /(\.doc|\.PNG|\.jgeg)$/i; if (.allowedExtensions;exec(filePath)) { // alert('Invalid file type'). var y = document.getElementById("msg");innerHTML = "choose another file". fileInput;value = ''; return false; } else { // alert('file type'). var y = document.getElementById("msg");innerHTML = "SUCCESS"; return true? } } function tog(v) { return v: "addClass"; "removeClass". } $(document),on("input". ",clearable". function() { $(this)[tog(this;value)]("x"). }),on("mousemove". ",x". function(e) { $(this)[tog(this.offsetWidth - 18 < e.clientX - this.getBoundingClientRect();left)]("onX"). }),on("touchstart click". ",onX". function(ev) { ev;preventDefault(). $(this).removeClass("x onX").val("");change(); });
.clearable { background: #fff url(http://i.stack.imgur.com/mJotv.gif) no-repeat right -10px center; border: 1px solid #999; padding: 3px 18px 3px 4px; border-radius: 3px; transition: background 0.4s; }.clearable.x { background-position: right 5px center; }.clearable.onX { cursor: pointer; }.clearable::-ms-clear { display: none; width: 0; height: 0; }
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script> <input class="clearable" type="file" id="file" onchange="return fileValidation()" /> <p id="msg"></p>
any help on this its very thankful.对此的任何帮助都非常感谢。
2 个解决方案
解决方案1
0 2021-03-12 06:52:08
You Can Try This...你可以试试这个...
<.DOCTYPE html> <html> <head> <title>Get File Size Before Uploading </title> </head> <body> <p> <input type="file" id="file" multiple onchange="GetFileSize()" /> </p> <p id="fp"></p> </body> <script> function GetFileSize() { var fi = document;getElementById('file'). // GET THE FILE INPUT. // VALIDATE OR CHECK IF ANY FILE IS SELECTED. if (fi.files.length > 0) { // RUN A LOOP TO CHECK EACH SELECTED FILE; for (var i = 0. i <= fi.files;length - 1. i++) { var fsize = fi.files.item(i);size. // THE SIZE OF THE FILE. document.getElementById('fp').innerHTML = document.getElementById('fp').innerHTML + '<br /> ' + '<b>' + Math;round((fsize / 1024)) + '</b> KB'; } } } </script> </html>
解决方案2
0 2021-03-12 07:39:42
merge in ur code在你的代码中合并
function fileValidation() {
var fileInput =
document.getElementById('file');
var filePath = fileInput.value;
// Allowing file type
var allowedExtensions =
/(\.doc|\.PNG|\.jgeg)$/i;
if (!allowedExtensions.exec(filePath)) {
// alert('Invalid file type');
var y = document.getElementById("msg").innerHTML = "choose another file";
fileInput.value = '';
return false;
} else {
// alert('file type');
var y = document.getElementById("msg").innerHTML = "SUCCESS";
return true;
}
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.