最新のWeb開発のチュートリアル
 

AJAX - onreadystatechangeイベント


onreadystatechangeイベント

サーバに要求が送信されると、我々は、応答に基づいて、いくつかのアクションを実行します。

onreadystatechangeイベントは、readyStateのは、変更するたびにトリガされます。

readyStateのプロパティは、XMLHttpRequestのの状態を保持します。

XMLHttpRequestオブジェクトの三つの重要な特性:

プロパティ 説明
onreadystatechange 店舗の関数(または関数の名前が)毎回のreadyStateプロパティの変更に自動的に呼び出されます
readyState XMLHttpRequestのステータスを保持します。 0から4への変更:
0:要求が初期化されていません
1:サーバ接続が確立します
2:受信した要求
3:処理要求
4:完成した要求と応答の準備ができて
status 200: "OK"
404:ページが見つかりません

onreadystatechangeイベントでは、サーバの応答を処理する準備ができたときに何が起こるかを指定します。

readyStateのは4で、ステータスが200である場合、応答は準備ができています:

function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
  if (xhttp.readyState == 4 && xhttp.status == 200) {
    document.getElementById("demo").innerHTML = xhttp.responseText;
  }
};
»それを自分で試してみてください

注:onreadystatechangeイベントが5回(0-4)、readyStateの中の各変更のための1時間にトリガされます。


コールバック関数を使用して、

コールバック関数は別の関数にパラメータとして渡された関数です。

あなたのウェブサイト上で複数のAJAXのタスクを持っている場合は、XMLHttpRequestオブジェクトを作成するための1つの標準関数を作成し、各AJAXのタスクのためにこれを呼び出す必要があります。

関数呼び出しは、URLとどのような(おそらくコールごとに異なります)onreadystatechangeに行うにはが含まれている必要があります。

function loadDoc(cFunc) {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
  if (xhttp.readyState == 4 && xhttp.status == 200) {
    cFunc(xhttp);
  }
»それを自分で試してみてください