客戶端js判斷上傳文件類型和文件大小

時間 2019-12-18

原文原文鏈接

因爲項目須要,須要腳本在客戶端判斷上傳文件大小和類型！兼容ie6，ie7，ie8 ，Google Chrome，ff等瀏覽器 javascript

<html>
html

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript"> java

//判斷當前瀏覽器是否爲IE瀏覽器
var isIE = /msie/i.test(navigator.userAgent) && !window.opera;
function fileChange(target) {
var fileSize = 0; 瀏覽器

//能夠上傳的文件類型
var filetypes =[".jpg",".png",".rar",".txt",".zip",".doc",".ppt",".xls",".pdf",".docx",".xlsx"]; ide

//獲取上傳文件的本地路徑
var filepath = target.value; ui

//上傳文件的大小限制
var filemaxsize = 1024*2;//2M
if(filepath){
var isnext = false; this

//獲取上傳文件的擴展名
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; spa

//IE瀏覽器要在javascript中實現文件操做功能，主要就是依靠FileSystemobject對象.net

var fileSystem = new ActiveXObject("Scripting.FileSystemObject");
if(!fileSystem.FileExists(filePath)){
alert("附件不存在，請從新輸入！");
return false;
}
var file = fileSystem.GetFile (filePath);
fileSize = file.Size;
} else { orm

//對於支持 HTML5 FileAPI 的瀏覽器 (IE10, FF 3.6+, Chrome 13+, Safari 5+, Opera 11.1+),能夠直接使用 files[0].size。這些屬性屬於 DOM

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>