PHPで簡単なajaxローディング関数を実装する方法

この記事では、主にPHPで単純なajax Loadingロード関数を実装する方法を紹介し、サンプルの形でajaxロードの原理、操作スキル、および関連する注意事項を分析します。必要な友人はそれを参照できます

詳細は次のとおりです。 :

var xmlHttp;
function createXmlHttpReq() {
  if(window.ActiveXObject) {
    xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
  } else if(window.XMLHttpRequest) {
    xmlHttp = new XMLHttpRequest();
  }
}
function funMy(url) {
  createXmlHttpReq();
  try {
    xmlHttp.onreadystatechange = cb;//一定要在open()前,下边会有说明。在此处犯错了
    xmlHttp.open("GET","for.php?id="+url,true);
    xmlHttp.send(null);
  } catch(e) {
    alert("您访问的资源不存在");
  }
}
//回调函数
function cb() {
  if(xmlHttp.readyState==1) {
    alert("1-------------->");
    //在Google Chrome 浏览器里不显示loading图片，三秒后显示内容,问题已解决，下边有说明
    document.getElementById(&#39;ajax&#39;).innerHTML = "<img src=loading2.gif>";
    //document.getElementById(&#39;ajax&#39;).innerHTML = "Loading......";
  }
  if(xmlHttp.readyState == 4 && xmlHttp.status == 200) {
      var data = xmlHttp.responseText;
      document.getElementById(&#39;ajax&#39;).innerHTML = data;
  }
}

テスト中にChromeでスタックしてしまいました。以下の説明を参照してください:

このように書くと、.readyState==1の応答は返されません

1は.open()が呼び出され完了したことを意味するためです

しかし、.open()は.onreadystatechange イベントの前に呼び出されるため、 .readyState==1 の応答を受け取ることは不可能であるはずです

したがって、 .readyState==1 =>.onreadystatechange の応答を受け取りたい場合は、それより前でなければなりません.open()
それでは、なぜ時々受信するのでしょうか?

同じグローバル変数を使用しているため...継続的な操作中に、xhrリクエストがまだphpを待っているため、再度初期化することによってトリガーされる可能性があります

まずデータの処理方法をonreadystatechangeで決めてから、処理対象のデータをopen()で送信します

以上がこの記事の全内容となりますが、皆様の勉強に少しでもお役に立てれば幸いです。

関連する推奨事項:

Ajaxグローバルロードボックス(ロードエフェクト)の構成

データを返す前のAjax ロード待機エフェクト(グラフィックチュートリアル)

Ajaxの実装効果

以上がPHPで簡単なajaxローディング関数を実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。