Hochladen von Datei mit jQuery Ajax

Ich habe viele Suche nach dem Hochladen von Dateien aus einem Formular mit Ajax gemacht, und festgestellt, dass xhr2 sollte es tun können. Ich habe jedoch versucht, FormData-Objekte zu verwenden, und es funktioniert nicht.Hochladen von Datei mit jQuery Ajax

Hier ist ein einfaches HTML-Formular

<!DOCTYPE html> 
<html> 
    <head> 
     <title>File Upload</title> 
    </head> 
    <body> 
     <form id="form" method="post" action="post.php" enctype="multipart/form-data"> 
      <input type="file" name="img"/> 
      <input type="submit" value="Upload" /> 
     </form> 
     <script src="jquery.js"></script> 
     <script src="upload.js"></script> 
    </body> 
</html>

Und hier ist die ‚post.php‘ Datei, die als die ‚altmodische‘ Art und Weise genannt ganz gut funktioniert:

<?php 
if($_FILES['img']['error'] > 0) die('Error ' . $_FILES['file']['error']); 
if(empty($_FILES['img']['name'])) die('No file sent.'); 

$tmp = $_FILES['img']['tmp_name']; 

if(is_uploaded_file($tmp)) 
{ 
    if(!move_uploaded_file($tmp, 'img.png')) echo 'error !'; 
} 
else echo 'Upload failed !'; 
?>

Und hier ist ‚upload Js

$(function() { 
    $('#form').submit(function(e) { 
     e.preventDefault(); 
     data = new FormData($('#form')); 
     console.log('Submitting'); 
     $.ajax({ 
      type: 'POST', 
      url: 'post.php', 
      data: data, 
      cache: false, 
      contentType: false, 
      processData: false 
     }).done(function(data) { 
      console.log(data); 
     }).fail(function(jqXHR,status, errorThrown) { 
      console.log(errorThrown); 
      console.log(jqXHR.responseText); 
      console.log(jqXHR.status); 
     }); 
    }); 
});

haben Sie eine Ahnung, warum es nicht funktioniert? Die Konsole gibt 'Keine Datei gesendet' zurück.

Vielen Dank!

Quelle

2013-08-25 Théo Winterhalter

Versuchen Sie, den Code zu ersetzen:

data = new FormData($('#form'));

mit diesem:

data = new FormData($('#form')[0]);

zu bekommen das erste DOM-Element aus dem jQuery-Array.

Quelle

2013-08-25 12:31:05 noamtcohen

Ich kann nicht glauben, dass es nur das war! Danke vielmals ! –

Hochladen von Datei mit jQuery Ajax

Antwort

Verwandte Themen