Bagaimanakah Saya Boleh Menggunakan XMLHttpRequest untuk Menghantar Data POST dalam JavaScript?

POST Penghantaran Data Menggunakan XMLHttpRequest

Dalam JavaScript, objek XMLHttpRequest menyediakan cara untuk menghantar data ke pelayan secara tidak segerak. Ini boleh berguna apabila menghantar data borang tanpa memuat semula halaman.

Menukar Penyerahan Borang kepada XMLHttpRequest

Pertimbangkan borang HTML berikut:

<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>

Untuk mencapai fungsi yang setara menggunakan XMLHttpRequest, kita boleh menulis perkara berikut kod:

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);

Kod ini membuka permintaan POST ke URL yang ditentukan, menetapkan maklumat pengepala yang diperlukan dan menghantar parameter. Anda boleh mengubah suai pembolehubah 'params' untuk memasukkan sebarang data yang anda perlu hantar.

Penukaran Objek-ke-Parameter

Jika anda mempunyai objek yang ingin anda hantar sebagai parameter, anda boleh menukarnya kepada tatasusunan pasangan kunci/nilai yang dikodkan URL menggunakan kod berikut:

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]));
}

Ini akan mencipta rentetan yang boleh digunakan sebagai parameter permintaan dalam pembolehubah 'params' dalam panggilan XMLHttpRequest.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menggunakan XMLHttpRequest untuk Menghantar Data POST dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!