JavaScript - Ajaxの基礎(レスポンスの処理)

初めての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-5を解いてみる。

その他参考書籍

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

14-5.

コード(TextWrangler)

var xmlhttp = new XMLHttpRequest();
var drink = encodeURIComponent($('#drink').val());
var url = "http://sitekamimura.blogspot.jp/index.html";
xmlhttp.open('GET', url, true);
xmlhttp.onreadystatechange = print_recipe1;
xmlhttp.send(null);
// jQuery版
var option = { 
  type:'GET', 
  dataType: "html",
  url:url,
  success:print_recipe2,
  error:print_error,
  complete: print_end
};
function print_recipe1(){
  $('#pre0').append(xmlhttp.readyState + ", " + xmlhttp.status + "\n");
  if(xmlhttp.readyState === 4 && xmlhttp.status === 200){
    $('#pre0').append("成功!\n");
    $('#pre1').text(xmlhttp.responseText);
  } else {
    $('#pre0').append("通信中か失敗!\n");
  }
}
function print_recipe2(data, textStatus){
  $('#pre0').append("jQuery版 成功!\n");
  $('#pre2').text(data);
}
function print_error(){
  $('#pre0').append("jQuery版: エラー\n");
}
function print_end(){
  $('#pre0').append("jQuery版: 終了\n");
}
$.ajax(option);

jQueryを使用したバージョン

まだ完成にはほど遠いけどとりあえず次に進む事に。