1. 程式人生 > >用jquery-form.js提交帶文件的數據

用jquery-form.js提交帶文件的數據

offset 發布 文件選擇 需要 保存 con file -m 選擇

最近做一個項目需要同時向後臺傳文件和數據,經過多方考證,選擇了使用jquery-form.js插件。所以總結一下,僅大家參考;

html部分:

<form enctype="multipart/form-data" method="post" action="/api/auth/update/updateVersion" class="form form-horizontal form-member-add" id="updatereviseform" autocomplete="off">   

  <div class="row cl">

   <label class="form-label col-xs-4 col-sm-4 col-md-4 col-lg-3"><span class="c-red">*</span>將發布軟件版本號:</label>

      <div class="formControls col-xs-6 col-sm-8 col-md-6 col-lg-4 clearfix">
<input type="text" class="input-text createversion f-l" placeholder="請輸入軟件版本號" name="softVersion">
<span class="f-l"></span>
</div>
</div>
  <div class="row cl">

<label class="form-label col-xs-4 col-sm-4 col-md-4 col-lg-3"><span class="c-red">*</span>升級文件選擇:</label>
<div class="formControls col-xs-6 col-sm-6 col-md-6 col-lg-6 clearfix">
      <input type="file" multiple name="file" class="file f-l" id="file" >
<span class="f-l"></span>

</div>
</div>
<div class="row cl">

    <label class="form-label col-xs-4 col-sm-4 col-md-4 col-lg-3"><span class="c-red">*</span>可升級的軟件版本號:</label>
      <div class="formControls col-xs-6 col-sm-8 col-md-6 col-lg-4 clearfix">
<input type="text" class="input-text software f-l" placeholder="請輸入可升級軟件版本號" name="updatedSoftVersions">
<span class="f-l"></span>
</div>
</div>
<div class="row cl">
<div class="col-xs-8 col-sm-8 col-md-8 col-lg-8 col-xs-offset-4 col-sm-offset-4 col-md-offset-4 col-lg-offset-3 ">
<input type="submit" class="completecreate" id="completecreate" value="">
<input type="submit" class="cancelcreate" id="cancelcreate" value="">
</div>
</div>
</form>
js部分:
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.form.js"></script>
<script type="text/javascript">
  $("#updatereviseform").submit(function()  {
$(this).ajaxSubmit({
success: function(data) { // data 保存提交後返回的數據,一般為 json 數據
if(data.code == 0){
alert("提交成功")

}else{
alert("提交失敗")
}
}
});
  return false;
  });
</script>
只是一個簡單的小案例,如有需要,可以留言溝通

用jquery-form.js提交帶文件的數據