JavaScript - Ajaxの基礎(リクエストの正常終了(jQuery, success))

初めてのJavaScript 第2版
Shelley Powers (著)
武舎 広幸、武舎 るみ (訳)

開発環境

• OS X Lion - Apple(OS)
• Safari (Webプラウザ)
• TextWrangler(Text Editor) (BBEditの無料、light版)
• Script言語:JavaScript
• JavaScript Library: jQuery

『初めてのJavaScript 第2版』(シェリー・パワーズ著(Shelley Powers著)、武舎 広幸+武舎 るみ訳、オライリー・ジャパン、2009年、ISBN978-4-84312-225-5) の14章(Ajaxの基礎)練習問第14-3を解いてみる。

その他参考書籍

• JavaScript 第6版
• JavaScriptリファレンス 第6版
• 『jQueryクックブック』(jQuery Community Experts 著、株式会社クイープ 訳、オライリー・ジャパン、2010年、ISBN978-4-87312-269-1)

14-3.

エラー無しで正常終了したリクエストの状態は、XMLHttpRequestオブジェクトのreadyStateプロパティの値が4、statusプロパティの’値が200。

jQueryではsuccessにリクエストがエラー無しで正常終了した時に呼び出したい関数を指定すればいい。

コード(TextWrangler)

function f(){
  $('#pre0').append("成功\n");
}
function g(){
  $('#pre0').append("エラー\n");
}
function h(){
  $('#pre0').append("終了\n");
}
function changed(){
  $('#pre0').append("xmlhttp.readyState:" + xmlhttp.readyState + 
    ", xmlhttp.status:" + xmlhttp.status + "\n");
  if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
    f();
  } else {
    g();
  }
  h();
}
var u= "http://mkamimura.com/";
var xmlhttp = new XMLHttpRequest();
xmlhttp.open('GET', u, true);
xmlhttp.onreadystatechange = changed;
xmlhttp.send(null);
var option = {type:'GET', url:u, dataType:'html', success:function(){
  $('#pre0').append('jQuery版\n');
  f();
}, error:function(){
  $('#pre0').append('jQuery版\n');
  g();
}, complete:function(){
  $('#pre0').append('jQuery版\n');
  h();
}};
$.ajax(option);