首頁 > web前端 > js教程 > 如何在 JavaScript 中使用 XMLHttpRequest 發送 POST 資料?

如何在 JavaScript 中使用 XMLHttpRequest 發送 POST 資料?

Barbara Streisand
發布: 2024-12-19 05:43:08
原創
113 人瀏覽過

How Can I Use XMLHttpRequest to Send POST Data in JavaScript?

使用 XMLHttpRequest 進行 POST 資料傳輸

在 JavaScript 中,XMLHttpRequest 物件提供了將資料非同步傳送到伺服器的方法。這在傳輸表單資料而不重新載入頁面時非常有用。

將表單提交轉換為XMLHttpRequest

考慮以下HTML 表單:

<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>
登入後複製

要使用XMLHttpRequest 實現以下等效功能,我們可以編寫以下等效功能,我們可以編寫以下等效功能,我們可以編寫以下等效功能內容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);
登入後複製

此程式碼開啟對指定URL的 POST 請求,設定必要的標頭訊息,並傳送參數。您可以修改 'params' 變數以包含您需要傳輸的任何資料。

物件到參數的轉換

如果您有要傳送的物件作為參數,您可以使用以下程式碼將其轉換為URL​​ 編碼的鍵/值對數組:

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]));
}
登入後複製

這將建立一個可以用作XMLHttpRequest 呼叫中「params」變數中的請求參數的字串。

以上是如何在 JavaScript 中使用 XMLHttpRequest 發送 POST 資料?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板