使用jquery-form.js表單提交文件上傳方式

 

最近在做兼容IE低版本的項目，那麼如果您的項目中需要上傳文件，且能需要進度，同時傳遞另外的data數據，那麼form.js 是值得你使用的，廢話不多說，直接上代碼

需要一個表單， enctype 需要設置爲 "multipart/form-data"  以表單格式提交 這裏不做深究

<form  name="form"  action="{:Url('Relbatch/setImportData')}" enctype="multipart/form-data"  method="post"  id="frm1">  
  <input type="file" id="file_upload" class="file" name="file"> 
  <input type="hidden" value="" name="data_source" id="data_source">
  <input type="hidden" value="" name="order_type" id="order_type">
  <button type="button"  class="btn fill_max_but " id="add_ex" >確定</button>
 </form>

$("#add_ex").on("click",function(){              
   $('#frm1').ajaxSubmit({
     url : setImportDataUrl,
     success : function(data) { 
         var data=JSON.parse(data);
         //  成功後代碼  
     },
     beforeSend: function(){
        // 上傳前
     },
     uploadProgress: function(event, position, total, percentComplete) {
        //上傳的過程
        //position 已上傳了多少
        //total 總大小
        //percentComplete 已上傳的百分數
      },
      error : function(data) {
        //   失敗後代碼
      }
     })    
 
});

注意！！！

這裏要注意的是：如果兼容IE低版本那麼後端返回數據格式一定不要返回JSON格式，

因爲IE瀏覽器會把返回的json格式數據當成文件，直接彈出，提示你下載或者打開保存。

IE瀏覽器不可以用js模擬點擊事件 trigger("click")  來操作，提示 拒絕訪問！！！

操作：作者提供的示例

——————————————           end         ——————————————————————