js提交form表单 - input file 文件上传控制上传文件的大小和格式

js提交form表单

所以我总结了一下,用Javascript提交表单大概有两种写法(根据我目前的理解)

1. document.formName.submit();

2.  var form = document.getElementById(id);
    form.submit();


input file 文件上传控制上传文件的大小和格式


html

<form  action="/ask/addaskrecordattachment2" enctype="multipart/form-data" method="post" id="attachment_uploads">
  <div class="attachs fl">
       <div class="t_fjfont">附件:</div>
       <div class="upload_btns"><input type="file" name="file"  id="file" οnchange="fileChange(this);" /> <input type="hidden" name="id" class="hideids" /></div>
       <div class="upload_btns" style="color:red;" id="upsizelabel"> (为了保证您的询价质量及服务,请先下载材料模板)</div>
  </div>
  <div class="attachs fl">
       <div class="t_fjfont" style="color:red;font-size:12px;font-weight:bold">文件上限2MB</div>
       <div class="upload_btns" style="color:0066CC;text-decoration: underline;"> <a href="javascript:getDownload();" >附件表格样式(下载)</a></div>
  </div>
  <div class="attachs fl">
       <div class="t_fjfont"> </div>
       <div class="upload_btns"><input type="file" name="files"  id="file_fujian" οnchange="filefujianChange(this);" /> <input type="hidden" name="rev" class="hide_rev" /></div>
       <div class="upload_btns" style="color:red;" id="upsizelabel"> (请上传CAD图纸或者图片格式,此处不接受询价单)</div>
  </div>
   <div class="clear"></div>
  </form>


js

function fileChange(target) {
     var fileSize = 0;         
     if (isIE && !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"){
          alert("请选择execl格式文件上传!");
          target.value="";
          return
      }
    } 
    
   function filefujianChange(target) {
       var fileSize = 0;         
       if (isIE && !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 !="jpg" && fileName !="jpeg" && fileName !="pdf" && fileName !="png" && fileName !="dwg" && fileName !="gif" ){
          alert("请选择图片格式文件上传(jpg,png,gif,dwg,pdf,gif等)!");
            target.value="";
            return
        }
      }



ps:支持市面上主流的浏览器~~~~~IE,谷歌,FF都支持!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值