AJAX를 사용하여 AJAX를 사용하여 여러 이미지 업로드하기

Question

및 FormData Object을 사용하여 여러 이미지를 업로드하려고합니다. 문제는 스크립트가 오직 하나의 이미지 만 업로드하고 다른 이미지는 아무것도하지 않는다는 것입니다.

이 스크립트는 단지 여기서

크롬

에서 사용될

스크립트 JS이다

PHP에서

(function() { 
    var count = 0; 

    function showUploadedItem(source,index) { 
     var list = $("#image-list"); 
     list.append("<li><img class='" + count + "' src=''></li>"); 
     $("." + count + "").attr("src",source); 
     count++; 
    } 

    $('[type="file"]').change(function() { 
     var file = this.files; 

     $.each(file, function(i, filename) { 
      reader = new FileReader(); 
      reader.onloadend = function (e) { 
       showUploadedItem(e.target.result, filename.name); 
      }; 

      reader.readAsDataURL(filename); 
     }); 
    }); 

$('button').click(function() {  

    var files = $("[type='file']")[0].files; 

    $.each(files, function(i, file) { 

     var formdata = new FormData(); 
     formdata.append('images', file.name, file); 

     console.log(formdata); 

     $.ajax({ 
      url :"up.php", 
      data:formdata, 
      type:"POST", 
      contentType: false, 
      processData: false, 
     }); 
    }); 
}); 
}()); 

I이있다 : I는 I 때문에 비트를 코드를 수정

<?php 
    move_uploaded_file($_FILES["images"]["tmp_name"], "img/" . $_FILES['images']['name']); 
?> 

문제를 발견했지만 지금은 이미지를 제출할 때 PHP 제한 파일 업로드에 문제가 있으며 양식 데이터가 파일을 하나씩 업로드하지 않습니다.

EDIT2 : 내가 찾은 해결책은 클릭 이벤트 내에 각 루프를 넣고 각 루프 내에서 아약스 호출을 넣는 것입니다.

Answer 1

FormData는 파일 목록이 아닌 단일 파일을 사용합니다. 코드에서 file 실제로 FileList이다, filename이

formdata.append("images[]", filename);