タグ

ブックマーク / ajax.pgtop.net (3)

  • Ajax初心者入門講座

    Ajaxの基礎からはじまり、高機能なJavaScriptデバッガを備えているFirebugの使い方、フレームワークであるPrototype.jsを使ったサンプルまでを、初心者向けに図を使って詳しく解説しています。 前回は Ajax の動作に専念してもらうために、プログラムの解説を省略しましたので、ここで詳しく解説します。 プログラムは今すぐ理解できなくても大丈夫です。安心してください。基的な部分は変わることがないので、何回も繰り返すうちに分かるようになります。 初めて見たものは難しく感じますが、見慣れると何となく簡単に思えてきます。全体的な流れがつかめれば、今の段階ではOKです。 ■pref.html側 (1)文字コードを UTF-8 に設定している部分です。 <meta http-equiv="Content-Type" content="text/html; charset=UTF-

    Ajax初心者入門講座
  • Ajax初心者入門講座

    Ajax の特徴は、「非同期通信」と「動的にページを書き換える」ことですが、言葉だけで説明すると難しく感じますので、実際に体験してみることにしましょう。すぐに「そういうことか!」と実感できます。 Ajaxで作ったWebアプリケーションで有名なのは、GoogleマップやGoogleサジェストですが、これらは一度は使ったことがあると思います。そこで今回は私が楽天Webサービスを使用して作った、簡単なAjaxの例を紹介します。 最初の例はキーワードを入力すると、楽天Webサービスから商品データを取得して表示するシステムです。楽天のサーバーとのやりとりにAjaxを使っています。 *動作確認は Microsoft Internet Explorer バージョン6 で行なっています。 【1】以下のURLをクリックし、「楽天シンプル検索」にアクセスします。 http://ws.bzen.net/raku

    Ajax初心者入門講座
  • Ajax初心者入門講座

    AjaxのプログラムでjQueryのreadyを使ってみましょう。 jQueryとはJavaScriptライブラリの一種で、今やデファクトスタンダードと言われるくらい人気です。 前回はわざとJavaScriptのプログラムの中で、jQueryの機能を呼び出していました。 何故なら、最初はできるだけ元のプログラムを変更せずに、 最小限の修正だけで動くようにしたかったからです。 でもjQueryっぽい書き方というか、 来ならjQueryのイベントやメソッドを使った書き方があります。 そこで今回は、前のプログラムを、jQueryを主体として書き換えてみます。 早速、やってみましょう。 【1】前回に作成したsample002jq フォルダをコピーして sample002jq-2 フォルダを作成します。 【2】今回は以下のようなファイルの構成になります。 ・test.js を少しだけ変更します。

    Ajax初心者入門講座
  • 1