AJAX-Bedienungsanleitung in PHP

<form action="submit.php" method="post">
    ...
    <input type="submit" value="提交">
</form>

Nachdem der Benutzer das Formular abgeschickt hat, wird die Seite neu geladen und das Formular werden Die Daten werden an den Server gesendet, damit der Benutzer die vom Server zurückgegebene Antwort erhalten kann. Allerdings erfordert diese Methode ein Neuladen der Seite, was zu unnötigen Verzögerungen führt und das Benutzererlebnis beeinträchtigt.

Um diese Situation zu vermeiden, können wir die Formularübermittlung mithilfe der AJAX-Technologie implementieren, ohne die Seite zu aktualisieren. Dies kann auf folgende Weise erreicht werden:

var xhr = new XMLHttpRequest();
xhr.open("POST", "submit.php", true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.onreadystatechange = function() {
    if(xhr.readyState === 4 && xhr.status === 200) {
        document.getElementById("result").innerHTML = xhr.responseText;
    }
};
var formData = new FormData(document.getElementById("form"));
xhr.send(formData);

Der obige Code wird zuerst erstellt. Rufen Sie das XMLHttpRequest-Objekt xhr ab und verwenden Sie dann die offene Methode, um die Anforderungsmethode (POST), die URL (submit.php) und die asynchrone Übertragung (true) festzulegen. Als nächstes verwenden Sie die setRequestHeader-Methode, um die Header-Informationen zum Inhaltstyp festzulegen. In der Rückruffunktion onreadystatechange können wir den Status der Anfrage und den Statuscode der Antwort ermitteln, um sicherzustellen, dass die Anfrage erfolgreich zurückgegeben wird. Verwenden Sie abschließend das FormData-Objekt, um die Formulardaten abzurufen und die Anforderung über die Sendemethode zu senden.

2. Verwenden Sie jQuery zur Implementierung von AJAX

jQuery ist eine beliebte JavaScript-Bibliothek, die eine Reihe praktischer Funktionen und Tools zur Vereinfachung von AJAX-Operationen bereitstellt. Mit jQuery können wir AJAX-Anfragen einfach implementieren. Das Folgende ist ein Beispielcode für die Implementierung von AJAX mit jQuery:

$("#form").on("submit", function(event) {
    event.preventDefault();
    $.ajax({
        url: "submit.php",
        type: "POST",
        data: new FormData(this),
        processData: false,
        contentType: false,
        success: function(data) {
            $("#result").html(data);
        },
        error: function() {
            alert("请求失败！");
        }
    });
});

Der obige Code verwendet die Ajax-Methode von jQuery, um AJAX-Anfragen auszuführen. Vor dem Absenden des Formulars verwenden wir event.preventDefault(), um das Standardereignis zum Senden des Formulars zu verhindern, damit die Seite nicht aktualisiert wird. Setzen Sie als Nächstes das URL-Attribut auf „submit.php“ und das Typattribut auf „POST“, verwenden Sie das FormData-Objekt, um die Formulardaten abzurufen, und setzen Sie die Attribute „processData“ und „contentType“ auf „false“, um sicherzustellen, dass die Formulardaten nicht verarbeitet werden. Wenn die Anfrage erfolgreich ist, können wir entsprechende Vorgänge in der Erfolgsrückruffunktion ausführen. Wenn die Anfrage fehlschlägt, können wir dies in der Fehlerrückruffunktion entsprechend behandeln.

3. AJAX-Zugriff auf von PHP zurückgegebene JSON-Daten

Wenn eine AJAX-Anfrage an PHP gestellt wird, kann PHP verschiedene Datentypen wie HTML, XML, JSON usw. zurückgeben gewöhnlicher Text. In PHP wird die Verwendung von JSON für den Datenaustausch immer beliebter, sodass die Rückgabe von JSON-Daten in AJAX-Anfragen zu einem wichtigen Thema geworden ist. Das Folgende ist ein einfaches PHP-Programm, das zeigt, wie Daten aus der Datenbank im JSON-Format zurückgegeben werden:

<?php
    $db = new PDO("mysql:host=localhost;dbname=test", "root", "password");
    $query = $db->prepare("SELECT * FROM users");
    $query->execute();
    $result = $query->fetchAll(PDO::FETCH_ASSOC);
    echo json_encode($result);
?>

Der obige Code verwendet die PDO-Bibliothek, um eine Verbindung zur Datenbank herzustellen und alle Daten aus der Benutzertabelle abzurufen . Über die Funktion json_encode konvertieren wir die Daten in das JSON-Format und geben sie auf der Seite aus. Anschließend können die Daten in der AJAX-Anfrage abgerufen und verarbeitet werden:

$.ajax({
    url: "get_data.php",
    type: "GET",
    dataType: "json",
    success: function(data) {
        console.log(data);
    }
});

Der obige Code verwendet die Ajax-Methode von jQuery, um die Daten abzurufen, und setzt das dataType-Attribut auf json. Wenn die Anfrage erfolgreich ist, enthält der Datenparameter Daten im JSON-Format und wir können die Methode console.log verwenden, um die Daten auszugeben. Natürlich können wir die Daten auch analysieren und entsprechende Vorgänge ausführen.

Zusammenfassung

Dieser Artikel enthält eine detaillierte Erklärung der AJAX-Operationen in PHP. Der Einsatz der AJAX-Technologie kann nicht nur die Effizienz und Benutzererfahrung von Webanwendungen verbessern, sondern auch einen flexibleren und bequemeren Datenaustausch ermöglichen. AJAX ist zu einer unverzichtbaren Webentwicklungstechnologie geworden. Durch Kenntnisse der AJAX-Technologie können effizientere und dynamischere Webanwendungen erzielt werden.

Das obige ist der detaillierte Inhalt vonAJAX-Bedienungsanleitung in PHP. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!