Ajax PHP 簡単入門チュートリアル code_PHP チュートリアル

まず、javascript でこのオブジェクトを作成する方法を理解しましょう:
var xmlHttp = new XMLHttpRequest(); この単純なコード行は、Mozilla、Firefox、Safari、Opera、および基本的に任意の形式または方法で Ajax をサポートするすべての Microsoft 以外のブラウザーで動作します。サーバーでは、XMLHttpRequest オブジェクトが作成されます。しかし、市場シェアが 70% ある IE では、この方法は不可能であり、IE のバージョンごとに作成方法が異なるため、IE でオブジェクトを作成するには次の 2 つの方法を使用する必要があります:

コードをコピーする コードは次のとおりです:

try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");//新しいブラウザの場合
} catch (err) {
try {
xmlHttp = new Active XObject( "Microsoft .XMLHTTP");//古いブラウザの場合
} catch (err2) {
xmlHttp = false;
}
}

それでも、一部のブラウザではこのオブジェクトを作成できない可能性があることは予測できませんので、その場合作成が失敗した場合は、次を追加する必要があります:

if (!xmlHttp){
alert("Cannot create XMLHttpRequest object!");
}
その組み合わせは次のとおりです:

コードをコピーします コードは次のとおりです:

var xmlHttp = false;
try {
xmlHttp = new XMLHttpRequest();
} catch (trymicrosoft) {
xmlHttp = new ActiveXObject("M sxml2.XMLHTTP");
} catch (otherMicrosoft) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (失敗) {
xmlHttp = false;
}
}
if (!xmlHttp){
alert("XMLHttpRequest オブジェクトを作成できません! ");
}


次に、非同期リクエストを開く関数 getInfo() を作成しましょう:

コードをコピーします

コードは次のとおりです: function getInfo() {

var num = document.getElementById("num").value;//フォームデータを取得します

var url = "/ajax/1.php?n=" +scape(num);
xmlHttp.open("GET", url, true );//ここでの true は非同期リクエストを表します
}

open() で設定したら、リクエストを送信できます。 send() を使用してデータを送信できますが、URL 自体を通じてデータを送信することもできます。実際、ほとんどの GET リクエストでは、URL を使用してデータを送信する方がはるかに簡単なので、ここでは send() のパラメーターとして null を使用するだけです。 URLアドレス内のphpファイルは、通常PHPを使用する場合と同様に、必要なデータの処理を要求するphpファイルです。複数のパラメータを&で区切って追加できます。

xmlHttp.send(null);

データを送信した後、コールバック メソッドを使用してサーバーのステータスを取得する必要があるため、onreadystatechange 属性が使用されます。

xmlHttp.onreadystatechange = updatePage;
このステートメントは、後続の updatePage が返された情報を処理する関数であるように、send() ステートメントの前に配置する必要があります。完全な getInfo() は次のとおりです:




コードをコピーします

コードは次のとおりです: function getInfo() {

var num = document.getElementById("num").value;//フォームデータを取得します

var url = "/ajax/1.php?n=" +scape(num);
xmlHttp.open("GET", url, true);//ここで true は非同期リクエスト
xmlHttp を表します。 onreadystatechange = updatePage
}

;
この関数を HTML でトリガーする必要もあります:

次に、updatePage( ) を記述する必要があります。この関数:

function updatePage(){
if (xmlhttp.readyState == 4) {
var response = xmlhttp.responseText;
document.getElementById("city").value =
}
}
上記このコードのreadyStateは、サーバーから返されるステータスです。このステータス4は、リクエストが送信され、処理されたことを示します。 responseText はサーバーから返された情報を取得し、それを JavaScript を通じて ID city を持つフォームに割り当てます。

この時点で、単純な Ajax プログラムが完成します。完全な javascript コードは次のとおりです。 xml Http = new ActiveXObject("Msxml2.XMLHTTP");
} catch (othermicrosoft) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP")
} catch (失敗) {
xmlHttp = false;
}
}
if (!xmlHttp){
alert("XMLHttpRequest オブジェクトを作成できません!");
}

function getInfo() {
var num = document.getElementById("num").value;フォームの Data
var url = "/ajax/1.php?n=" +scape(num);
xmlHttp.open("GET", url, true);//ここで true は非同期リクエストを表します
xmlHttp.onreadystatechange = updatePage;
xmlHttp.send(null);
}
関数 updatePage(){
if (xmlhttp.readyState == 4) {
var 応答 = xmlhttp.responseText("city"); = 応答;
}
}
ここにはまだ php ファイルがありません。処理方法と記述方法が異なり、これは Ajax の主要な部分ではないため、ここにはコードを配置しません。 php は必要なデータを出力して返すことを覚えておいてください。




今日は長い間更新していませんでしたが、初心者に非常に適しています。



http://www.bkjia.com/PHPjc/319034.html

www.bkjia.com

tru​​e

http://www.bkjia.com/PHPjc/319034.html

技術記事

まず、javascrīpt でこのオブジェクトを作成する方法を理解しましょう: varxmlHttp=newXMLHttpRequest(); この単純なコード行は、Mozilla、Firefox、Safari、Opera など基本的に何でも動作します...