[轉]客戶端js判斷文件類型和文件大小即限制上傳大小

時間 2019-12-10

原文原文鏈接

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

須要腳本在客戶端判斷大小和文件類型，因爲網上沒有適合的，就本身寫了一個並測試文件上傳大小限制的一個例子，在此與你們分享下

因爲項目須要！須要腳本在客戶端判斷大小和文件類型！本身網上找資料找的好辛苦！索性本身寫了一個並測試文件上傳大小限制的一個例子，兼容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> 
 