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

  由于项目需要!需要脚本在客户端判断大小和文件类型!自己网上找资料找的好辛苦!索性自己写了一个并测试 文件上传大小限制的一个例子,兼容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" style="width: 500px;" onchange="fileChange(this);"/>

  </body>

  </html>