form表單上傳附件的幾種方法

問題描述：在網頁開發過程中，當需要上傳附件（圖片，音頻，視頻等）時，常規方法是使用form表單進行提交，這裏總結一下form表單提交的幾種方法。

參考地址：http://www.cnblogs.com/zhuxiaojie/p/4783939.html

1.使用form表單進行提交

<form name="form名稱" action="請求地址"  method="請求類型" enctype ="multipart/form-data">
    <input type="file" name="">
    <input type="text" name="">
    <input type="submit" value="提交">
</form>

2.使用FormData對象

function editUserInfo() {
    var formData = new FormData(document.getElementById('editUserInfo'));
    $.ajax({
      url: url,
      type: method,
      data: formData,
      processData: false,
      contentType: false,
      xhrFields: {
        withCredentials: true
      },
      crossDomain: true,
      success: function (obj) {
        // ...
      },
      error: function (obj) {
        // alert('服務器請求失敗');
      }
    })
  }

3.使用jquery.form.js

• jquery.form.js是一個強大的表單插件，其大量的提供了表單操作的各種簡便的方法
• 前提先引入jquery.form.js插件
• 詳細信息請參考http://jquery.malsup.com/form/

// ajaxSubmit提交form表單
  function updateUserInfo() {
    $('#表單ID').ajaxSubmit({
      url: url,
      type: 'POST',
      //data: $('表單ID').serialize(),
      //processData: false,
      //contentType: false,
      xhrFields: {
        withCredentials: true
      },
      crossDomain: true,
      success: function (obj) {
        // ...
      },
      error: function (obj) {
        // alert('服務器請求失敗');
      }
    });
  }