js 判断上传文件大小及格式代码

前端技术 2023/08/31 JavaScript
我们在做文件上传时,为了实现异步上传的效果,一般会选择采用iframe的形式来进行文件的上传,但我们不能像ajax那样对服务端返回的数据进行处理,从而来进行文件大小以及文件样式的判断,所以我们一般也会想到使用js对上传的文件大小以及格式进行初步的判断,在服务端再进行一次判断(防止浏览器拒绝执行脚本文件)。
以下提供一种方法用js判断文件大小。
复制代码 代码如下:

var url = window.location.href, type = url.substr(url.lastIndexOf(\'/\')+1);
// console.log(type);
var allowType = {
\".bmp\":1, \".png\":1, \".jpeg\":1, \".jpg\":1, \".gif\":1,
\".mp3\":2, \".wma\":2, \".wav\":2, \".amr\":2,
\".rm\":3, \".rmvb\":3, \".wmv\":3, \".avi\":3, \".mpg\":3, \".mpeg\":3, \".mp4\":3
};
var allowSize = {1:2097152, 2:5242880, 3:20971520};
var errMsg = {
\"0\" : \'图片格式不正确<br/>\'
+ \'音频格式不正确<br/>\'
+ \'视频格式不正确<br/>\',
\"1\" : ‘图片格式不正确\',
\"2\" : \'音频格式不正确\',
\"3\" : \'视频格式不正确\'
};
var errSizeMsg = {
\'1\':\'图片文件小于2M\',
\'2\':\'音频文件小于5M\',
\'3\':\'视频文件小于20M\',
}
function checkFileType(filename, type){
var ext = filename.substr(filename.lastIndexOf(\".\")).toLowerCase(),
res = allowType[ext];
if (type == 0) {
return !!res;
} else {
return type == res;
}
}
function checkFileSize(target, size){
var isIE = /msie/i.test(navigator.userAgent) && !window.opera;
var fileSize = 0;
if (isIE && !target.files)
{
var filePath = target.value;
var fileSystem = new ActiveXObject(\"Scripting.FileSystemObject\");
var file = fileSystem.GetFile (filePath);
fileSize = file.Size;
} else {
fileSize = target.files[0].size;
}
// var fsize = fileSize / 1024*1024;
if(parseInt(fsize) >= parseInt(size)){
return false;
}else{
return true;
}
}
function upload(obj){
var filename = jQuery.trim(jQuery(\'#uploadFile\').val());
if (!filename || filename == \"\"){ // 提交前的再次检测
alert(\'选择需要上传的文件\');
return false;
}
if (!checkFileType(filename, type)){
alert(\'文件格式不正确\');
return false;
}
var ext = filename.substr(filename.lastIndexOf(\".\")).toLowerCase();
var res = allowType[ext];
if(!checkFileSize(obj,allowSize[res])){
alert(errSizeMsg[res]);
return false;
}
//其他处理
}
//uploadFile为上传控件的id,obj为上传控件的本身(this)

本文地址:https://www.stayed.cn/item/1119

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见,何事秋风悲画扇。