Image FormDataの複数入力によるアップロード

Question

複数のファイル入力でFormDataを使用するにはどうすればよいですか？

<input type="file" id="file1"> 

<input type="file" id="file2"> 

<input type="file" id="file3"> 

Answer 1

ここでは1つの入力ファイルに複数のファイルをアップロードできます。クリックせずに自動アップロードを開始する場合は、onchangeメソッドで行う必要があります。 ajaxからは、new FormData()を使用する必要があります。

upload.php

<input type="file" id="files" name="filefield" multiple="multiple"> 
<script type="text/javascript"> 
$("#files").on("change",function(){ 
    var ajaxData = new FormData(); 
    var obj = $(this)[0]; 
    $.each(obj.files,function(i,file){ 
     ajaxData.append("file['"+i+"']",file); 
    }); 
    $.ajax({ 
     url :'index.php', 
     data: ajaxData, 
     contentType: false, 
     processData: false, 
     dataType: 'json', 
     type:"POST", 
     success : function() { 

     } 
    }); 
}) 

のindex.php

<?php 
    var_dump($_FILES); 
?>