input type= file經過ajax 來異步上傳

1. input類型設爲file：

   <label for="img_input"></label> <input id="img_input" type="file"/>

    

2. 獲取文件內容：

   var file = document.getElementById('fileToUpload').files[0];

    

3. 上傳： XMLHttpRequest Level 2添加了一個新的接口FormData。利用FormData對象，咱們能夠經過JavaScript用一些鍵值對來模擬一系列表單控件。比起普通的Ajax，使用FormData的最大優勢就是咱們能夠異步上傳一個二進制文件。

   // 建立 
   var form_data = new FormData(); 
   // 獲取文件 
   var file_data = $("#img_input").prop("files")[0]; 
   // 把因此表單信息 
   form_data.append("id", "001"); 
   form_data.append("name", "test"); 
   form_data.append("img", file_data); 
   $.ajax({ 
     type: "POST",
     url: "....",
     dataType : "json",
     processData: false, // 注意：讓jQuery不要處理數據
     contentType: false, // 注意：讓jQuery不要設置
     contentType data: form_data
   }).success(
       function(msg) { console.log(msg); }
      ).fail(
       function(msg) { console.log(msg); }
      );