最近流行のAjaxのお勉強
最近流行の Ajax を勉強してみた。勉強というほどでもないが、Webサイト検索して使い方を学ぶ。なんでかっていうと、複数の検索を同時にしたときに、全部待ってたら、最も長く時間がかかるやつに合わせて結果を表示することになるが、それを待たないで良いなら、スムーズにページが表示されるだろうと考えたからだ。
というわけで、次のようなページなどを参考にした。
- @IT: 古くて新しいAjaxの真実を見極める ( http://www.atmarkit.co.jp/fwcr/special/ajax01/03.html )
- Hawk's W3 Laboratory ( http://www.hawk.34sp.com/stdpls/xml/xmlhttprequest.html )
- いまさら人に聞けないAjaxと簡単なサンプル ( id:higepon:20050816 )
など...。
やってることは、比較的簡単みたい。リクエスト用オブジェクト作成、レスポンス用関数登録、DHTMLでデータを入れて表示する。という感じ。
検索の場合に、ページとは別に結果を表示したいような場合があるので、
- 検索ページ表示
- onLoad でリクエスト
- 非同期通信のレスポンスがきたら、特定のdivにデータを入れる。
という感じでいけそうだ。とおもって、いろいろやってたら、うまくいかない。そもそもリクエストが飛ばない。なんでかなーなんておもって、あやしいのはJavaScriptのエラー。どうやってしらべるかいなとおもったんだけど、FirefoxのJavaScriptのコンソールは行番号/エラーが出るしわかりやすかった。IEにScriptデバッガいれるか悩んでたけど、とりあえず要らないや...。というわけで、Firefox でデバッグして、なんとか動作確認が完了。使い方はわかったので、あとはそれ用の検索結果を返すようにしないと。
Ajaxのリクエスト用のオブジェクトって、書き方からすると多分同時に別のレスポンス関数は使えないんだろうなと勝手におもう。なので、複数リクエストを同時に行う場合は、別々にする必要があるのかな。。。その辺は不明だけど。。時間が有ったらテストするかな。