js 前端验证文件上传格式，限制上传文件大小（兼容各种浏览器）
js 前端验证文件上传格式，js 前端验证上传文件大小，兼容各种浏览器
·
项目中经常用到需要上传文件、照片等功能，同时需要限制所上传文件的大小。
很多插件都会采用后台请求验证，前端Js校验比较少。
本篇介绍一个前端JS便捷判断上传文件大小的方法。
之前也看了很多代码，浏览器不太兼容，这个是比较好的：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="text/javascript">
var isIE = /msie/i.test(navigator.userAgent) && !window.opera;
function fileChange(target, id) {
var fileSize = 0;
var filetypes = [".jpg", ".png", ".rar", ".txt", ".zip", ".doc", ".ppt", ".xls", ".pdf", ".docx", ".xlsx"];
var filepath = target.value;
var filemaxsize = 1024 * 2;//2M
if (filepath) {
var isnext = false;
var fileend = filepath.substring(filepath.indexOf("."));
if (filetypes && filetypes.length > 0) {
for (var i = 0; i < filetypes.length; i++) {
if (filetypes[i] == fileend) {
isnext = true;
break;
}
}
}
if (!isnext) {
alert("不接受此文件类型！");
target.value = "";
return false;
}
} else {
return false;
}
if (isIE && !target.files) {
var filePath = target.value;
var fileSystem = new ActiveXObject("Scripting.FileSystemObject");
if (!fileSystem.FileExists(filePath)) {
alert("附件不存在，请重新输入！");
return false;
}
var file = fileSystem.GetFile(filePath);
fileSize = file.Size;
} else {
fileSize = target.files[0].size;
}
var size = fileSize / 1024;
if (size > filemaxsize) {
alert("附件大小不能大于" + filemaxsize / 1024 + "M！");
target.value = "";
return false;
}
if (size <= 0) {
alert("附件大小不能为0M！");
target.value = "";
return false;
}
}
</script>
</head>
<body>
<input type="file" name="contractFileName" style="width: 500px;" onchange="fileChange(this);"/>
</body>
</html>
华为开发者空间，是为全球开发者打造的专属开发空间，汇聚了华为优质开发资源及工具，致力于让每一位开发者拥有一台云主机，基于华为根生态开发、创新。
更多推荐
0
0- 0
已为社区贡献2条内容
所有评论(0)