formData - AJAX - PHP-上傳多個文件

所以我正在做一個小項目，並且在過去的幾個小時裏，我試圖找出如何上傳多個文件，通過AJAX將formData Obj上傳到PHP服務器。formData - AJAX - PHP-上傳多個文件

我覺得這很容易，因爲我上傳一個文件時工作起來很容易，但是當我想向FormData Obj中添加多個文件時，我會得到所有類型的錯誤。

我當前的代碼：以上

HTMN/AJAX::  
formData = new FormData($('#form')[0]); 
formData.append("File", $("#myFile1")[0].files[0]); 
       $.ajax({ 
        url: '../uploadFile.php', 
        data: formData, 
        cache: false, 
        contentType: false, 
        processData: false, 
        type: 'POST', 
        dataType: 'json' 
       }).fail(function(jqXHR) { 
        console.log(jqXHR.responseText); 
        console.log(jqXHR.status); 
       }); 
      } 


PHP: 
echo $_FILES['File']['name']; 
{Lots of code, not worth pasting - my point is that, its working!}

代碼的偉大工程和IM能得到我需要的一切 - 和文件上傳到我的選擇的路徑。但第二我試圖.append另一個文件崩潰。如果我不喜歡下面的代碼崩潰，並與不確定的指數引發錯誤

formData.append("File1", $("#myFile1")[0].files[0]); 
formData.append("File2", $("#myFile2")[0].files[0]);

想我會盡力推動它追加到同一陣列像這樣;

formData.append("File[]", $("#myFile1")[0].files[0]); 
formData.append("File[]", $("#myFile2")[0].files[0]);

，並再次它似乎工作的偉大，只要我只能用一個文件這樣做，但我第二次推另一個文件到MYFILE []數組，它拋出未定義的索引錯誤。對我來說，好像我打破了formData obj，當我追加多個文件時 - 出於某種原因。

我的問題的解決方案是運行多個AJAX調用，每個AJAX調用上傳一個文件 - 但似乎是一個非常低效的解決方案。所以如果有人能幫助我，我會很感激！

來源

2014-02-16 user3238663

嘗試追加總是相同的鍵 – ponciste

'formData.append（「File」，$（「＃myFile1」）[0] .files [0]）;' 'formData.append（「File」，$ （「＃myFile2」）[0] .files [0]）;' – ponciste

相同的未定義索引錯誤：注意：未定義索引：文件 – user3238663

formData.append("File1", $("#myFile1")[0].files[0]);
formData.append("File2", $("#myFile2")[0].files[0]);

通過這種方法，你適應PHP的一部分

echo $_FILES['File']['name'];

相應

...？否則，當然你會得到一個「未定義索引」的錯誤。

formData.append("File[]", $("#myFile1")[0].files[0]);
formData.append("File[]", $("#myFile2")[0].files[0]);

這可不行，因爲

FormData.append() :
Appends a key/value pair to the FormData object.

- 和爲JavaScript，File[]僅僅是一個不相關的任何字符串數組，所以你的第二線將覆蓋在你的FORMDATA的第一個目的。

但是你也可以自己指定數組索引，

formData.append("File[0]", $("#myFile1")[0].files[0]); 
formData.append("File[1]", $("#myFile2")[0].files[0]);

- 這應該工作，並給你上傳的文件陣列，你的PHP腳本。
要驗證，請在接收腳本的開頭創建一個var_dump($_FILES);。

來源

2014-02-16 15:26:11 CBroe

1）是我ofc。改編的PHP腳本以及:) 2）工作正常，我有一個txt []數組，我追加多個字符串與formData.append（「txt []」，$（this）.val（））。我能夠運行通過它們在PHP中的所有通常與陣列:) 3）將嘗試文件[0]並回到你身邊，但我很確定我已經嘗試過它:) – user3238663

所以，與您的解決方案（其實很好），會有很多'$ _FILES'？會發生什麼，如果我只是這樣做：'formData.append（「my_files」，[這將是一個文件[0]]數組'''，將只有一個'$ _FILES'？哪種方式更有效率，還是相同？謝謝你的回答 – user2002495

嘗試了你提到的最後一件事，但似乎仍然無法正常工作 - 不過謝謝不管:) – user3238663

對於純JavaScript中使用這種方法
的HTML

<form type="multipart/form-data" > 
    File 1: <input id="file1" name="file1" type="file" /><br /> 
    File 2: <input id="file2" name="file2" type="file" /><br /> 
      <br /> 
<input type="submit" value="Submit" onclick="your_function();" /> 
</form>

的JavaScript：

function your_function(){ 
    var file1 = _("file1").files[0]; 
    var file2 = _("file2").files[0]; 
    var formdata = new FormData(); 
formdata.append("file1", file1); 
formdata.append("file2", file2); 
    var ajax = new XMLHttpRequest(); 
    ajax.open("POST", "path-to-your.php"); 
    hr.onreadystatechange = function() { 
     if(ajax.readyState == 4 && ajax.status == 200) { 
        alert(ajax.responseText); 
       /*do what you wish here */ 
     } 
    } 
    ajax.send(formdata); 
}

的PHP

<?php 
echo $_FILES['file1']['title']; 
echo $_FILES['file2']['title']; 
?>

希望這有助於某人。

來源

2016-02-16 22:33:23

formData - AJAX - PHP-上傳多個文件

回答

相關問題