一覧トップ/WEBデザイン関連/JS/Ajax通信/JSからPOSTデータを送信する - tianlang @ ウィキ

POSTメソッドでリクエストをで送信して受信する
XMLHttpRequestでリクエストを送信し、テキストデータを受信します。

文字化け対策
responseTextの文字化けについては「文字コード関連調査[responseText]」が詳しいです。

HTMLファイルの文字コードはUTF-8にします。

テキストデータは文字コードをUTF-8にしてURIエンコードし、Unicodeサイン(BOM)をつけます。

URIエンコードした文字列は、ブラウザのアドレス欄に次のように入力することで調べることができます。

javascript:document.write(encodeURI('文字列'))

POSTメソッド
POSTメソッドを使用するには、open()の第1引数に "POST" を指定します。

open()の第2引数は URL を指定します。

第3引数には非同期通信ならtrueを、同期通信ならfalseを指定します。

var url = "sample01.cgi";
var request = createXMLHttpRequest();
request.open("POST", url, true);
request.send("");

createXMLHttpRequest()については、「XMLHttpRequestを生成する」をご覧ください。

受信
サーバからのデータを受信するには、onreadystatechangeでイベントを捕捉します。

受信が終了したら readyState は 4 になり、リクエストが成功していたら status は 200 になります。

テキストを取得するには、responseTextを使用します。
取得したテキストはエンコードされている(※)ので、decodeURI()でデコードします。

※文字化けを回避するため、サーバ側からエンコードされているテキストを送信します。

request.onreadystatechange = function() {

 if (request.readyState == 4 && request.status == 200) {
   //受信完了時の処理
   var result = document.getElementById("result");
   var text = document.createTextNode(decodeURI(request.responseText));
   result.appendChild(text);
 }

}