作成 2010.01.05
更新 2015.02.22
Ajax の本体
XMLHttpObject

いわゆる Ajax の本体です。受信したテキストは responseText で取得できます。
なお、Internet Explorer は同じ URL を取得しようとすると2回目以降はキャッシュから取得するため、毎回違う URL にする必要があります。

function createXMLHttpRequest(){
  var XMLHttpObject = null;
  try{
    XMLHttpObject = new XMLHttpRequest();
  }catch(e){
    try{
      XMLHttpObject = new ActiveXObject("Msxml2.XMLHTTP");
    }catch(e){
      try{
        XMLHttpObject = new ActiveXObject("Microsoft.XMLHTTP");
      }catch(e){
        return null;
      }
    }
  }
  return XMLHttpObject;
}
メソッドとプロパティ
メソッドとプロパティ 機能
open(METHOD, page [, async_frag [, user_name [, password] ] ]) リクエストメソッドとページを指定します。async_frag には、true または false を指定します。true は応答を待たず、false は応答を待って処理を継続します。
send(post_body) 実際に発信します。POSTメソッドの場合は post_body に入れます。
abort() 現在実行中のリクエストを中止します。
onreadystatechange(function) 通信中の状態が変わった時にどのような処理をするか設定します。 通常、受信したときの処理を設定します。このメソッド名はすべて小文字で記述してください。
setRequestHeader(field_name, field_body) リクエストヘッダーを追加したり変更したりします。
getResponseHeader(field_name) fileld_name のレスポンスヘッダーを取得します。
getAllResponseHeaders() レスポンスヘッダーをすべて取得します。
readyState 通信の状態を取得します。文字列による比較も可能なようですが未確認です。詳細は readyState を参照してください。
responseText 受信したデータをテキスト形式で取得します。
responseXML XML DOM形式で取得します。
サーバーから送付する際の Content-Type は application/xml または text/xml にする必要があります。
status HTTP のステータスコードを取得します。
statusText HTTP のステータスコードを文字列形式で取得します。
readyState
状態 説明
uninitialized 0 オブジェクトはデータでイニシャライズされていない。
loading 1 オブジェクトはデータをロード中である。
loaded 2 オブジェクトのデータの読み込みが完了しています。
interactive 3 オブジェクトはデータをロード中であっても、操作可能である。
complete 4 コントロールは完全にロードされた。
使い方
GET リクエスト
var sct = (new Date()).getTime();
var httpobj = createXMLHttpRequest();
httpobj.open("GET", "test.php?sct=" + sct, true);
httpobj.onreadystatechange = function(){
 if(httpobj.readyState == 4){
   var textdata = httpobj.responseText;
 }
};
httpobj.send(null);
POST リクエスト

リクエストヘッダーを追加する点と、send メソッドに送信データを入れる点がキモです。

var sct = (new Date()).getTime();
var p1 = "post1"
var p2 = "post2"
var p3 = "post3"
var httpobj = createXMLHttpRequest();
httpobj.open("POST", "test.php?ct=" + sct, true);
httpobj.setRequestHeader('Content-Type',
	'application/x-www-form-urlencoded; charset=UTF-8');
httpobj.onreadystatechange = function(){
  if(httpobj.readyState == 4){
   var textdata = httpobj.responseText;
  }
};
httpobj.send("p1=" + encodeURIComponent(p1)
	+ "&p2=" + encodeURIComponent(p2)
	+ "&p3=" + encodeURIComponent(p3));
タグ: JavaScript

©2004-2017 UPKEN IPv4