Wie verwende ich FormData für AJAX-Datei-Uploads mit jQuery richtig?

FormData für den AJAX-Datei-Upload verwenden

In diesem Szenario versuchen Sie, den AJAX-Datei-Upload per Drag-and-Drop zu implementieren generiertes HTML-Formular. Ihre aktuelle JavaScript-Implementierung erfordert jedoch Anpassungen, um das FormData-Objekt für den Datei-Upload korrekt zu nutzen.

Vorbereitungen

Erstellen Sie zunächst das FormData-Objekt:

var form = $('form')[0]; // For the entire form
var formData = new FormData(form);

Alternativ können Sie bestimmte Daten angeben, die Folgendes umfassen sollen:

var formData = new FormData();
formData.append('section', 'general');
formData.append('action', 'previewImg');
formData.append('image', $('input[type=file]')[0].files[0]);

Senden der Formular

Aktualisieren Sie als Nächstes Ihre jQuery-AJAX-Anfrage, um die folgenden Einstellungen einzuschließen:

$.ajax({
    url: 'Your url here',
    data: formData,
    **type: 'POST', // Use POST requests for file upload**
    contentType: false, // Important for file upload
    processData: false, // Important for file upload
    // ... Other options like success and etc
});

Diese Einstellungen stellen sicher, dass die Formulardaten korrekt als mehrteilige/Formulardatenanfrage gesendet werden , was für Datei-Uploads unerlässlich ist.

Zusätzlich Hinweis:

• contentType: false ist nur ab jQuery 1.6 verfügbar.
• Die Einstellung „Typ: „POST““ ist entscheidend, da für das Hochladen von Dateien POST-Anfragen erforderlich sind.

Das obige ist der detaillierte Inhalt vonWie verwende ich FormData für AJAX-Datei-Uploads mit jQuery richtig?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!