Wie kann ich XMLHttpRequest verwenden, um POST-Daten in JavaScript zu senden?

POST-Datenübertragung mit XMLHttpRequest

In JavaScript bietet das XMLHttpRequest-Objekt eine Möglichkeit, Daten asynchron an einen Server zu senden. Dies kann nützlich sein, wenn Sie Formulardaten übertragen, ohne die Seite neu zu laden.

Konvertieren einer Formularübermittlung in XMLHttpRequest

Bedenken Sie das folgende HTML-Formular:

<form name="inputform" action="somewhere" method="post">
  <input type="hidden" value="person" name="user">
  <input type="hidden" value="password" name="pwd">
  <input type="hidden" value="place" name="organization">
  <input type="hidden" value="key" name="requiredkey">
</form>

Um die entsprechende Funktionalität mit XMLHttpRequest zu erreichen, können wir Folgendes schreiben Code:

var http = new XMLHttpRequest();
var url = 'get_data.php';
var params = 'orem=ipsum&name=binny';
http.open('POST', url, true);
http.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

http.onreadystatechange = function() {
    if(http.readyState == 4 && http.status == 200) {
        alert(http.responseText);
    }
}
http.send(params);

Dieser Code öffnet eine POST-Anfrage an die angegebene URL, legt die erforderlichen Header-Informationen fest und sendet die Parameter. Sie können die Variable „params“ so ändern, dass sie alle zu übertragenden Daten enthält.

Objekt-in-Parameter-Konvertierung

Wenn Sie ein Objekt haben, das Sie senden möchten Als Parameter können Sie es mit dem folgenden Code in ein Array von URL-codierten Schlüssel/Wert-Paaren konvertieren:

var params = new Object();
params.myparam1 = myval1;
params.myparam2 = myval2;

let urlEncodedData = "", urlEncodedDataPairs = [], name;
for( name in params ) {
    urlEncodedDataPairs.push(encodeURIComponent(name)+'='+encodeURIComponent(params[name]));
}

Dadurch wird eine Zeichenfolge erstellt, die verwendet werden kann als Anforderungsparameter in der Variablen „params“ im XMLHttpRequest-Aufruf.

Das obige ist der detaillierte Inhalt vonWie kann ich XMLHttpRequest verwenden, um POST-Daten in JavaScript zu senden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!