元の XMLHttpRequest メソッドの詳細 review_jquery

典型的なログイン検証の例を使って説明してみましょう

一般に、ログイン検証に XMLHttpRequest オブジェクトを使用するには、次の手順が必要です

1. DOM を使用して入力ボックスの値を取得します 🎜>

var userName = document.getElementById("userName").value;2. XMLHttpRequest オブジェクトを作成する主な理由は、ブラウザーの互換性の問題を考慮することです。

コードをコピーします

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

if (window.XMLHttpRequest) { //FireFox、Mozillar、Opera、Safari、IE7、IE8 の場合 overrideMimeType) { / XMLHTTPREQUEST オブジェクトを作成し、JS 配列に格納するために使用できる 2 つのコントロール名 // 以前のバージョンの方が新しい VAR Activexname = ["msxml2.xmlhtttt", "Microsoft.xmlhttp" ]; for (var i = 0; i < activexName.length; i ) {

try{

//作成するコントロール名を取り出し、作成が成功したらループを終了します
//作成が失敗した場合は例外がスローされ、その後はループを続行できます
xmlhttp = new ActiveXObject(activexName[i]);
Break;
🎜> }
}



3. コールバック関数を登録します。コールバック関数を登録する場合、関数名は必須であり、括弧は必要ありません。





コードをコピー


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


//コールバックを登録するとき関数、必須です 関数名、括弧は追加しないでください
//関数名を登録する必要があります。括弧を追加すると、関数の戻り値が登録されますが、これは間違っています
xmlhttp.onreadystatechange = callback;

4. 接続情報を設定 (GET)

コードをコピー

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

//最初のパラメータは http リクエスト メソッドを示し、すべての http リクエスト メソッドをサポートし、主に get と post を使用します
//2 番目のパラメータはリクエストされた URL を示しますget メソッドによって要求されるアドレス。パラメータは url
にもあります。//3 番目のパラメータは、非同期対話を使用するか同期対話を使用するかを示します。true は非同期を意味します

xmlhttp.open("GET","AJAXServer?name) =" userName,true);

5. リクエストの送信

コードをコピー

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


xmlhttp.send(null);

6. (POST) メソッドを設定する必要があります。 request ヘッダーは自分で作成し、エンコードする必要があるため、XHR で直接使用することはできません。データは open の 2 番目のパラメーターで送信されますが、データの送信には send() メソッドを使用する必要があります
。

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

//POST リクエストのコード
//xmlhttp.open("POST","AJAXServer",true);
//POST メソッドでは http リクエスト ヘッダーを自分で設定する必要があります
xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//POST 経由でデータを送信
xmlhttp.send("name=" userName);

コールバック関数:

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

//コールバック関数
function callback() {
//alert(xmlhttp.readyState);
//5.応答データの受信
// オブジェクトのステータスがインタラクション完了かどうかを判断します
if (xmlhttp.readyState == 4) {
// http インタラクションが成功したかどうかを判断します
if (xmlhttp.status = = 200 ) {
//サーバーエンドから返されたデータを取得します
//サーバーセグメントによって出力されたプレーンテキストデータを取得します
var responseText = xmlhttp.responseText;
//データを表示しますページ上
;
} else {