一次上传多张图片的jQuery方法

Question

使用这个脚本，我可以通过jquery上传一张图片，但如何同时上传多张图片呢？

另外，我该如何在php中接收所有的图片呢？

谢谢。

var inputFileImage = document.getElementById('image');
    var formElement = document.getElementById("RevisionTicket");
    var file = inputFileImage.files[0];
    var data = new FormData(formElement);
    data.append('image',file);
    var url = 'AprobarTicket2.php';
    $.ajax({
    url:url,
    type:'POST',
    contentType:false,
    data:data,
    processData:false,
    cache:false,
    beforeSend: function(){
                    $("body").addClass("loading"); 
                },
    success: function(data){
                    $("body").removeClass("loading");
                    //$("#contenidoSecPaginas").html(data);
                    alert(data);
    },
});

- user3810167

---

你的HTML文件中有许多不同名称的输入类型文件还是有许多同名的输入类型文件？ - Michel

尝试使用我下面的答案。希望能有所帮助。另外，正如@talsibony所说，您可能需要查看外部库，例如：http://www.dropzonejs.com或Jquery文件上传等。 - Michel

尝试使用这个问题和答案来上传多个文件！！！ - Guruprasad J Rao

请参见以下链接：https://dev59.com/Z4jca4cB1Zd3GeqPwm0F - guest271314

Answer 1

$('#formId').on('submit', function(event){
 event.preventDefault();

  var form = document.querySelector('#yourFormId');
    var request = new XMLHttpRequest();
    var formData = new FormData(form);
    request.open('post','phpScriptToProcessForm.php');
    request.send(formData);

    request.onreadystatechange = function() {
        if (request.readyState === 4) {
            if (request.status === 200) {
                       // OK

                   } else {
                       // not OK
                   }
               }
           }; 

});

PHP：

/* Note your input name must be an array
*  e.g <input type="file" name="inputName[]" multiple> 
*/
$image = $_POST['inputName'];
for($i = 0; $i <= count($image); $i++){

 //Process images data, upload, insertion, etc...
}

- Michel

Answer 2

我认为您需要使用外部库来允许多文件上传，请参见下面的JS fiddle:

<input type="file" class="multi with-preview" multiple />

http://jsfiddle.net/fyneworks/2LLws/

它使用https://rawgit.com/fyneworks/multifile/2.1.0-preview/jquery.MultiFile.js

还有许多其他上传多个文件的项目，例如uploadify、dropzone js等等。祝好运

这是使用本地JS上传的示例：

http://www.appelsiini.net/2009/html5-drag-and-drop-multiple-file-upload

- talsibony