[转]客户端js判断文件类型和文件大小即限制上传大小

原文地址:https://www.jb51.net/article/43498.htm

需要脚本在客户端判断大小和文件类型，由于网上没有适合的，就自己写了一个并测试 文件上传大小限制的一个例子，在此与大家分享下

 

由于项目需要！需要脚本在客户端判断大小和文件类型！自己网上找资料找的好辛苦！索性自己写了一个并测试 文件上传大小限制的一个例子，兼容ie6，ie7，ie8 ，Google Chrome，ff等浏览器

复制代码代码如下:

<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" onchange="fileChange(this);"/> 
</body> 
</html>