ajax使用FormData物件多檔上傳的方法-教學撰寫:徐嘉裕Neil hsu

之前寫了一篇心得是【ajax使用FormData物件上傳檔案】，那方法只針對單一檔案上傳，如果是多檔要使用FormData物件上傳需要修改一下檔案的取值方式，方法如下。

<input class="form-control" id="blockimg" type="file"  multiple/>

<button id="upload">Upload</button>

//$.ajax

 $('#upload').on('click', function() {

    var form_data = new FormData();  //建構new FormData()

      for(var i=0; i<$('#blockimg')[0].files.length;i++){

                   form_data.append('file[]', $('#blockimg')[0].files[i]);

               }

                              

    $.ajax({

                url: 'upload.php',

                cache: false,

                contentType: false,

                processData: false,

                data: form_data,     //data只能指定單一物件                 

                type: 'post',

               success: function(data){

                    $('#ajsxboxdhow').html(data);

                }

     });

});

這樣在upload.php中使用var_dump($_FILES['file']);觀看變數就會是陣列格式，後續再用class.upload.php之類的檔案上傳程式來做處理即可!


請參考使用php_class_upload的多圖上傳功能這篇心得

https://neohsuxoops.blogspot.com/2017/03/phpclassupload.html

教學撰寫：徐嘉裕 Neil hsu