Wie kann ich mit Ajax Daten und Dateien gleichzeitig hochladen?

Hochladen von Daten und Dateien in einem Formular mit Ajax

Das Hochladen von Daten und Dateien in einem Ajax-Formular ist eine häufige Anforderung in Webanwendungen. Hier finden Sie eine ausführliche Erklärung, wie Sie diese Aufgabe effektiv lösen können.

Das Problem

Der Versuch, sowohl Daten als auch Dateien mit Ajax zu übermitteln, kann aufgrund der unterschiedlichen Methoden schwierig sein werden von jQuery verarbeitet. Während $.serialize() Daten in einem Array sammelt, erfordern Formulardateien die Verwendung von new FormData().

Kombinieren der Methoden

Der Schlüssel zum Zusammenführen dieser Methoden verwendet das FormData-Objekt. FormData ist ein integrierter Konstruktor, mit dem Sie ein Formulardatenobjekt erstellen können. Dieses Objekt kann sowohl Daten als auch Dateien enthalten und ist daher ideal für unseren Zweck.

Beispiel

Um die beiden Methoden zu kombinieren, verwenden Sie den folgenden Code:

$("form#datafiles").submit(function(e) {
    e.preventDefault();
    var formData = new FormData(this);

    $.ajax({
        url: window.location.pathname,
        type: 'POST',
        data: formData,
        success: function (data) {
            alert(data)
        },
        cache: false,
        contentType: false,
        processData: false
    });
});

In diesem Fall enthält das #datafiles-Formular sowohl reguläre Dateneingaben als auch eine Dateieingabe. Die neue FormData(this)-Zeile erstellt ein neues FormData-Objekt mit den Daten des Formulars.

PHP-Skript

Um die hochgeladenen Daten und Dateien auf der Serverseite zu verarbeiten, Verwenden Sie ein PHP-Skript wie dieses:

<?php

print_r($_POST);
print_r($_FILES);

?>

Mit diesem Code können Sie über $_POST und sowohl auf die Formulardaten als auch auf hochgeladene Dateien zugreifen $_FILES superglobals.

Das obige ist der detaillierte Inhalt vonWie kann ich mit Ajax Daten und Dateien gleichzeitig hochladen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!