Wie kann ich ein Formular mit jQuery AJAX ohne Postback senden?

Verwenden von jQuery AJAX zum Senden eines Formulars

Bei der Arbeit mit Formularen kann es wünschenswert sein, Formulardaten mithilfe von AJAX an ein PHP-Skript zu senden anstatt ein herkömmliches Postback durchzuführen. Eine der Herausforderungen dabei ist das Sammeln und Senden aller Formulareingaben.

Glücklicherweise bietet jQuery mit seiner Methode serialize() eine unkomplizierte Lösung. So können Sie es umsetzen:

1. Deaktivieren Sie die Standardübermittlung des Formulars:

$('#formId').submit(function(event) {
  event.preventDefault();
});

2. Serialisieren Sie die Formulardaten:

Die Methode serialize() serialisiert die Elemente des Formulars und gibt eine Abfragezeichenfolge zurück, die in einer AJAX-Anfrage verwendet werden kann.

3. Machen Sie die AJAX-Anfrage:

$.ajax({
  type: "POST",
  url: "targetScript.php",
  data: $('#formId').serialize(),
  success: function(data) {
    // Handle the response from the PHP script
  }
});

Ersetzen Sie im obigen Code formId durch die tatsächliche ID Ihres Formulars und targetScript.php durch die URL des PHP-Skripts, das die Formulardaten verarbeiten wird.

Beispiel für die Antwortverarbeitung:

Innerhalb der Erfolgsfunktion der AJAX-Anfrage können Sie dies tun Verarbeiten Sie die vom PHP-Skript zurückgegebene Antwort. Wenn Sie beispielsweise eine Erfolgsmeldung erwarten, können Sie diese wie folgt anzeigen:

success: function(data) {
  alert("Your order has been submitted successfully.");
}

Durch Befolgen dieser Schritte können Sie Formulardaten nahtlos mit jQuery AJAX übermitteln, ohne alle Formulareingaben manuell erfassen zu müssen.

Das obige ist der detaillierte Inhalt vonWie kann ich ein Formular mit jQuery AJAX ohne Postback senden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!