美文网首页
前端:通过JS限制上传文件大小和格式

前端:通过JS限制上传文件大小和格式

作者: 慢半帧 | 来源:发表于2019-01-04 22:51 被阅读0次

    HTML 代码

    <form enctype="multipart/form-data" method="post" action="/work/file_update/">
      <input type="file" name="file" id="file" onchange="fileChange(this);">
      <input class="btn btn-default btn-lg btn-block" type="submit" value="上传" id="update_btn">
      <p>tips:暂时仅支持单次单个上传文件,且文件大小为2M以内,文件格式现仅支持.docx格式。</p>
    </form>
    

    JS代码

    <script>
        function fileChange(target) {
         var fileSize = 0;         
         if (!target.files) {     
           var filePath = target.value;     
           var fileSystem = new ActiveXObject("Scripting.FileSystemObject");        
           var file = fileSystem.GetFile (filePath);     
           fileSize = file.Size;    
         } else {    
          fileSize = target.files[0].size;     
          }   
          var size = fileSize / 1024;    
          if(size>2000){  
           alert("附件不能大于2M");
           target.value="";
           return
          }
          var name=target.value;
          var fileName = name.substring(name.lastIndexOf(".")+1).toLowerCase();
          // if(fileName !="xls" && fileName !="xlsx"){
          if(fileName !="docx"){
              alert("请选择.docx格式文件上传!");
              target.value="";
              return
          }
        } 
      </script>
    

    原文链接:http://www.manbanzhen.top/?p=240

    相关文章

      网友评论

          本文标题:前端:通过JS限制上传文件大小和格式

          本文链接:https://www.haomeiwen.com/subject/ttslrqtx.html