• 締切済み

ajaxでこんな事が出来るといった実例を教えて

ajax入門みたいな本を読んだのですが非同期通信?とか言葉だけの 説明で実際どのような事が可能なのかよくわかりません ajaxのサンプル サイトみたいな所でhttp://miniajax.com/というサイト を見つけたのですが英語のサイトのためいまいちです 質問 ・ajaxでこんな事ができるといったサイトがみたいです ・郵便番号を入れると住所が自動検索されるとかの実例を教えて下さい

みんなの回答

  • notnot
  • ベストアンサー率47% (4854/10269)
回答No.3

Ajaxが最初にメジャーになったのは、Googleマップです。 https://maps.google.co.jp/ ユーザー操作によって、画面遷移せずに、見る物を変えられる。 Google検索で、自動的に候補が追加される・・・「剛力彩芽」と入れると、「かわいくない」と出てくるとか・・・もAjaxです。 あとは、ユーザー操作無しに自動的に画面が変わるとかもあります。 http://chocoden.chobi.net/yamanote/yamanote2013b.html

全文を見る
すると、全ての回答が全文表示されます。
  • pringlez
  • ベストアンサー率36% (598/1630)
回答No.2

代表的なのはgoogleの検索です。検索キーワード入力欄に1文字以上入力すると候補のリストが勝手に表示されます。 入力文字でサーバに問い合わせ候補を返す。それを検索ボタンを押したときではなく入力文字が変化した時にリアルタイムに検索しに行っているわけですが、ああいうのです。 googleの検索で取り入れられてから、他の多くのサイトでも導入されていった、というような印象があります。

全文を見る
すると、全ての回答が全文表示されます。
  • gorusura
  • ベストアンサー率59% (25/42)
回答No.1

サイトは知りませんが、Ajax は、ただサーバーにリクエストを送り、応答を得るというだけのものです。 基本的には同一ドメイン上だけです。 実例: リアルタイムチャットはこれを使ってできます。 chat.dat がチャットの内容を保存しているデータだとすると、 一秒ごとにWebサーバーにHTTPリクエストを送り、返ってきた chat.data のデータを表示します。 次に、ユーザーが書き込む場合は、サーバー側の言語を使ったファイル(chat.cgiとか)を実行するように、HTTPリクエストを送信します。 このとき、ユーザーが入力したデータはsendします。 chat.cgiは受け取ったデータが正常であるか、などを確認して、適切な変換を施した後に、chat.dat に書き込みをします。 このような流れで可能です。 求める回答と違っていたらすみません。

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • ajax 通信 iisの設定?

    最近ACCESSとASPとJAVASCRIPTの勉強を始めた学生です。 どーしても分からない事があるので教えてください。 AjaxZip 2.0 - Ajax郵便番号→住所自動入力フォーム http://www.kawa.net/works/ajax/ajaxzip2/ajaxzip2.html のサイトより『ajaxzip2-20081102.zip』をダウンロードしてきました。 ます一つ目の謎はsampleフォルダの以下の二つをローカル(c:\...html)で実行時  ・sample-jquery.htmlは住所自動入力が動作する  ・sample-prototype.htmlは住所自動入力が動作しない のはなぜか? 二つ目は、iisを立ちあげているので 「http://localhost/...../sample-jquery.html」 で実行すると自動入力が動作しません。。。 iisの設定でクライアントからの非同期通信の許可?みたいな項目があるのでしょうか? どなたかご教示くださいませ。_ _ ペコリ

  • Ajaxについて教えてください。(定義と実装方法について)

    Ajaxについて教えてください。 (定義について) http://www.atmarkit.co.jp/fwcr/rensai/imasara03/imasara03_1.html (サンプル集) http://jsajax.com/default.aspx 【定義について】 >>Ajaxは略語で、正式名称は「Asynchronous JavaScript + XML」となります。Asynchronousは「非同期」という意味 とされいるようなのです。他にも調べてみると、 「Javascriptを使い,Webページとは非同期(Asynchronous)にXML形式(もしくはテキスト形式)のデータ通信を行う手法」といった風にかかれています。 この「Webページとは非同期」という部分がわからないのですが、どういったものを指しているのでしょうか? 【実践方法について】  Ajaxの実装はどういった手順で行うものなのでしょうか?  参考でみたホームページで、ライトボックスをみて感動したので、早速使ってみたいと思いました。いざAjaxサンプルページに載っている、ライトボックスのコードをコピー&ペーストで、自分のPC上で試してみたのですが、動かず悩んでいます。(汗)  調べていくうちに、ライブラリが必要なようなのですが、どのように実装することで、ライトボックスは使用できるようになるのでしょうか?    AjaxサンプルのURLにjQueryを使い倒せ!ということから、jQueryという、Ajax用のライブラリがあるのでしょうか?

    • ベストアンサー
    • AJAX
  • Ajaxの動き

    googleと本で調べたのですが、今いちわからないため質問させてください。 (1)教科書から、Ajaxは、XMLをJavascriptでやり取りしている非同期通信という定義なのはわかりましたが、結局、AJAXを使うということは、HTMLに、<Script>のタグで、JQueryなどのパスを書くということなのでしょうか? AJAXは概念的なものであって、プログラムやモジュールそのものではないと捉えています。 (2)Ajaxによる非同期通信は、何をきっかけとして通信が始まるのでしょうか? 通常は、FORMがSUBMITされたときに、サーバにリクエストがいくという認識ですが そもそも、Ajaxは、何をイベントとしてハンドルしているのでしょうか?(何をきっかけに処理が始まっているのでしょうか?) HTMLに、<Script>のタグで、JQueryのパスを書くと、ハンドルする機能が使用されるのでしょうか? Ajaxでも「リクエスト」は行われているけれども、処理結果として戻されるものがXML形式であるだけだという理解で良いのでしょうか?

    • ベストアンサー
    • AJAX
  • AjaxとJava

    私はAjaxの勉強をしようと思っています。 そのため、簡単なサーバ側はJavaのアプリケーションを作って学ぼうと思ったのですが、どうやって通信すればよいかよくわかりません。 一応わからないなりにいろいろ方法を考えてみたのですが、どれも疑問点があります。 (1)、サーバをJavaで作成して、Ajaxと通信する方法 (2)、JSPを使って、Ajaxと通信する方法 どちらの方法も、 (1)どうやってAjaxからの(正確にはJavaScriptからの)リクエストを受け取って、値を取り出したらいいか (2)どうやってサーバからJavaScriptにデータを送るのか がわかりません(送るパケットは極めてシンプルなもの、たとえば数字とか文字列がいいです)。 入門サイトはほとんどのサーバ側はPHPで作っているので、あまり参考にならないと考えています。 なにか参考になるようなサイトなどはないでしょうか? お返事お待ちしております。

  • Ajaxで住所検索

    Ajaxで郵便番号から住所検索をする機能を作成したのですが 郵便番号529であいまい検索して結果が表示されたあと 再度ほかの郵便番号413で検索しようとしたところ529の結果が表示されてしまいます。 このようのときの解決法を教えてください。 よろしくお願いいたします

    • ベストアンサー
    • AJAX
  • AjaxでXMLHttpRequestのローカル鯖

    Ajaxで使用するXMLHttpRequestをローカルサーバーで構築したいと考えています。 比較的簡単にできメジャーな方法を 教えてください。 下記サイトのサンプルなどを試したいと考えています。 AjaxTower  Ajax入門 http://www.ajaxtower.jp/ini/ Ajaxを勉強しよう http://www.openspc2.org/JavaScript/Ajax/Ajax_study/

    • ベストアンサー
    • AJAX
  • Ajaxのデーターをcsvから取る時について

    よろしくお願い致します。 自分はAjaxについては、昨日勉強始めたばかりで 1つずつ完成させて、次のステップに進もうと思っており 今回は社長と自分の師匠からAjaxを使って何か作ってみてと言われて 勉強をしてて、今目指しているのは査定ページとかなのですが まずは http://s-ej.com/sample/ajax/ajax0003/sample/sample.html ここのサイト様をご利用させて頂きたいと思い サンプルのダウンロードも行ってローカルでやっているのですが 自分がローカルで動かすとき カテゴリの本とかを別の名前に変更して csvの商品名とかもdocomoとかカテゴリに追加した物に入力をしたのですが どうしても、うまく行きません。 本=csvでは名称=item1 名称日本語=アイテム1 カテゴリ=本 自分が本の名前をdocomoとかに書き換えたら、名所・名所日本語・カテゴリも変えなきゃいけないのでしょうか? 今はカテゴリだけで、他の価格や適応などhtml上では削除しております。 本当、素人で申し訳ございませんが アドバイスの程、よろしくお願い致します。

  • こんなAjax探しています

    どなたか もしご存知なら このようなAjaxのサンプルライブラリーをご教授ください。 下記同じ様に、Flashをリロードせず、1枚のHTML内に項目を入れておきたく、クリック時に表示されると言うものです。 (SEO的にもクリック時のインクルードは、避けたいと考えています。) 尚且つ、このように 気持ちよくスライドしてくれて、各ページサイズの(縦サイズ)が変更可能であれば言う事ないのですが(^^; 各機能の単品動きのAjaxサンプルは拝見しましたが、このように混合すると初心者には厳しい状況です もし、ご存知であれば教えていただけますと幸いです。よろしくお願いいたします ■参考サイト http://mb.softbank.jp/mb/product/3G/830sh/

  • Ajaxをつかって連動するプルダウンに連動してCSVを読み込む

    やりたいことは下記のとおりです。 まず、箇条書きでご説明します。 ・プルダウンをAjaxでキレイにみせたい。 (参考にしようとしているサイト→http://moto-mono.net/sample/jQueryselectable/) ※ここはなんとかできるかもしれませんが、下記のAjaxと連動させてつかいたいので、参考程度に・・・ ・プルダウンを連動させたい。 (参考にしているサイト→http://c-man.s21.xrea.com/mars/md20071109.html) ※ここは、やり方がわかります。 参考サイトのまんま使えるため。 ここからが、わからない部分です。↓ ・プルダウンを連動させた最後の項目でリンクがしたい。 (参考にしようとしているサイト→http://javascript.maxux.com/js017.htm) ただ、このリンク先サイトは、プルダウンが連動しているわけではなくoption value="#" でリンクされているだけです。 そうではなく↓ 下記サイトのように http://www.openspc2.org/JavaScript/Ajax/Ajax_study/chapter03/002/sample1/index.html Ajaxを使って、CSVを表(テーブル)に反映させるようにしたいです。 このサイトでは onClick="loadDataFile('sample.csv')"  で、CSVを読み込んでいるのですが、このリンクをどこに貼り付ければよいのか、またどのようにはりつければよいのかがわかりません。 Ajaxはともに、Jqueryを使用するつもりですのでバッティングすることはないかなと勝手に思っています。 どなたかお力をお貸し下さい!

  • Ajaxを使った読み込みができない

    ●質問の主旨 Ajax(非同期通信)を使って、 ブラウザ上でテキストファイルの読み込みを させたいのですが、できません。 Ajaxにお詳しい方、ご指導願います。 ●質問の補足 HTML5とjqueryの技術を使って、 テキストファイルの中身(Hello,World)の 読み込みをさせたいと考えております。 参考サイトにもとづいてやってますが、 画像の表示ができません。 表示させるためにはどうしたら良いでしょうか? ●コード <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>jQueryの練習</title> <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> </head> <body> <h1>jQueryの練習</h1> <div id="main"></div> <input type="button" id="kick_ajax" value="Ajax!"> <script> $(function() { $('#kick_ajax').click(function() { $('#main').load('contents.txt', function() { alert('読み込み終了!'); }); }); }); </script> </body> </html> ●テキストファイルのファイル名 contents.txt ●参考サイト(ドットインストール) http://dotinstall.com/lessons/basic_jquery/519

    • ベストアンサー
    • AJAX