jQuery AJAX 上傳與 POST 資料

view plaincopy to clipboardprint

1. <label for="">選取檔案</label>  
2. <input type="file" name="import_file" id="import_file">  
3. <a role="button" class="btn btn-primary" id="upload_file" >上傳檔案</a>  

要做預覽的時候會用到，如果再傳檔案的同時也要傳其他參數的話，可以像這樣。

view plaincopy to clipboardprint

1. $("#upload_file").click(function(){   
2.     var preview = 1;    
3.     var files = $("#import_file").get(0).files;   
4.     var formData = new FormData();   
5.     formData.append("preview", preview);   
6.     formData.append("import_file", files[0]);   
7.     $.ajax({   
8.         url: 'api',   
9.         data: formData,    
10.         dataType: "json",   
11.         type: "POST",   
12.         cache: false,   
13.         contentType: false,   
14.         processData: false,   
15.         error: function(xhr) {   
16.             alert('Ajax request 發生錯誤');   
17.         },   
18.         success: function(json) {   
19.             
20.         },   
21.         complete: function(json){   
22.         }   
23.     });   
24. });