jQueryのAjaxリクエストについての動作とキャッシュに関する問題
- jQueryのAjaxリクエストの動作やキャッシュに関する問題について詳しく教えてください。
- Ajaxリクエストでテキスト情報を取得する際に、ブラウザキャッシュの問題によって表示が変わらないことがあるのはなぜでしょうか？
- また、テキストの変更が即座に反映されないのはなぜでしょうか？
- ベストアンサー
jQueryのAjaxリクエストの動作について教えてください。トンチン
jQueryのAjaxリクエストの動作について教えてください。トンチンカンなことを言っていたら許してもらいたいのですが・・・ loadメソッドを使って別テキストから情報を持ってきています。 リロード（最新の情報に更新）してもうまく表示が変わらない場合があります。 ≪１≫絶対にうまくいく場合 １．テキストの中身を変更 ２．ブラウザを開く ３．変更した情報が表示される。 ≪２≫たまに失敗する場合 １．ブラウザを開く ２．テキストの中身を変更 ３．リロードする。F5を押す。最新の情報に更新...etcを実行してみる →このときは変わる時もあればいくら更新をしても変わってくれないときもあります。 この状態で新たにブラウザを開くと現状１００パーセント更新されています。 リロードしても１００パーセント変更されないのはなぜでしょうか？ キャッシュがあるのでしょうか？？ また、WEBページを開いたままにしておいてテキストを変更すれば勝手に変わるなんてことは理論上不可能ですよね？ ページを見ている人にリロードをしてもらうことをお願いするなんて非現実的ですし・・・ ちなみにテキストの中身はVB.NETでやっています。サーバサイド側で何らかのキックを行ってloadだけ動かせたら面白いですが（汗）
- mr-r00
- お礼率93% (480/516)
- AJAX
- 回答数1
- ありがとう数6
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
ブラウザー側のキャッシュを使わせないためには、 リクエストヘッダーで制御するのが正当でしょうが、 urlの後ろに、日付けと時間等で作るユニークなゴミパラメーターを ダミーで加える手段もあります。
関連するQ&A
- 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
- JQueryでのAJAXで困ってます
最近AJAXを勉強しようと思い、JQueryに手を出しました。 JQueryで画面遷移無しでdivで作ったメニューを選択して内容を指定したdivに表示させようと思っているのですが、 JQueryでのloadの動作がブラウザの違いで異なる動きをするので困ってます。 IEでは内容が表示されて、新しく表示した部分のJavaScriptが正しく動くのでいいのですが、 Firefox、Operaでは新しく表示した部分のJavaScriptが動作しません。 Chromeでは新しく表示した部分のCSSでさえ適用されません。 IE以外でも正しく動作させるにはどうしたらいいでしょうか？ ご回答、よろしくお願いします。
- ベストアンサー
- AJAX
- jQueryのloadメソッドが時々反映されません
WEBページのiframeの中に表示させるHTMLにjQueryのloadメソッドを採用して動的に更新をさせています。 ＜例＞ $("#test").load("ttest/testtest.txt .moji"); こんなような単純なソースです。 これのWEBページを開いた時五分五分の確率で成功したり失敗したりします。 なお、失敗した場合でもIEをリロードすると正常に動くのですが・・・ なぜこのような失敗が起きるのでしょうか？ 原因が全くわかりません・・・ 詳しい方教えていただけませんでしょうか？ ＜環境＞ Win7 IE8 jQuery1.4.1
- ベストアンサー
- JavaScript
- JQueryはAJAXとは無関係？？
質問◆JQueryおよびJQueryMobileは「AJAX」とは無関係なのでしょうか？ 「JQueryMobileを使っているとき、DOMによってHTMLを動的に差し替えている」という認識なのですが、 特にRequest関連の記載をJavaScriptで記載していない限り、AJAXの処理は行われないのでしょうか？ それとも、 JQuery Mobileを使っている場合は、ページ遷移などで、プログラマが意識していなくても（独自にプログラムを書いていなくても） AJAXの処理が行われているのでしょうか？ /************************************/ サーバへのリクエストはなくても、１つのマシン内の、HTMLファイルとHTMLファイルの間で、 HTTPで通信がされるということはないと思っています。 （※基本、HTTPはクライアントとサーバの間のときしか使われないのですよね？） JQueryの技術情報のサイトを見ていると、 よく「document.ready」と書かれていたりするソースを見かけますが、 これはAjaxとは関係なく（通信とは関係なく）、 また「xhr.send」も書かれていないHTMLは、AJAXは使われないという理解です。 （「Form、submit」とも関係がない） XMLHttpRequestも「HttpRequest」とあるわけですし、 「Form、submit」を書いているときに行われるわけではないけれども、かわりに、 「xhr.send」とJavaScriptで実行されたタイミングで走る処理であり、 その際、「サーバから返される情報がXMLのデータ形式で(XML以外もですが、、)」だという理解なのですが、合っていますでしょうか？
- ベストアンサー
- AJAX
- どこからがAjaxと呼ばれるものかわかりません。
質問タイトルが漠然としたものですが。。。 たとえば、「Google maps」はページをリロードすることなく、 地図内で位置を自由に移動させることができる、というので イメージがしやすいです。 ただ、prototypeやjQuery等のJavaScriptライブラリなども Ajaxと呼ばれていたり・・・。 どういう部分がAjaxなのかがわかりません。 ライブラリのプラグイン？の機能によってこれはAjaxでこれは違う、 なんてことはあるでしょうか？ 例えば「Lightbox」はAjaxで、「アコーディオンメニュー」なんかは、 違う、とか。 なんだかAjaxという技術がどういうものであるのか自分の中で曖昧でよくわかりません。 （必ずしもXMLが使われている、とも限らないのでしょうか？） わからないまま質問をしているため、支離滅裂ですみません・・・ どうぞ宜しくお願いいたします。
- ベストアンサー
- AJAX
- jQueryのloadや$.ajaxに関して質問です。
jQueryのloadや$.ajaxに関して質問です。 ウェブサイトにおいて、 例えば、index.htmlがあるとします。 jQueryのloadや$.ajaxで、 .xmlや.txtなど別の場所にアップしたファイルから、 ニュースなどをとってきて更新した場合、 googleやyahooは、 indexにニュースが追加されたと思って、 通常の更新のように見なしてくれるのでしょうか？ 最近はPHPで生成されたhtmlも拾うようですが、 勉強不足で、自分の中うまく把握できません。 ajaxで呼んできたニュースや記事が、 通常のhtmlの更新のように見なされ（あるいは近いものとみなされ）、 index.htmlに書かれたニュースとしてクロールされるのでしたら、 ニュースなどにとどまらず、 SSIの代替などでも積極的に使用して行きたいのですが。。。 どなたか、ご教授よろしくお願いいたします。
- ベストアンサー
- AJAX
- jquery ajax 外部html 読み込み
現在、数年前にjquery(v1.4.3)を用いて制作したページの更新を行っており それに伴いjqueryも最新版(v1.11.1)への移行を試している最中なのですが ajaxの外部htmlを読み込む処理が実行されなくなり困っております。 旧バージョンとではメソッドの記述法が異なることは理解できておりますが 色々と書き換えてみたものの、以前のように動作させる事ができません。 以下がそれぞれの記述になりますが、もし問題にお気付きになられましたら ご指摘いただけますと幸いです。 jquery(v1.4.3): function loadAdd(obj){ $.ajax({ async: true, type: 'GET', url: tgtURL, dataType: 'html', cache: false, success: function(html){ var $div = $("#add"); $div.html(html); }, error: function(xhr, status, errorThrown){ alert("not found."); } }); } jquery(v1.11.1): function loadAdd(obj){ $.ajax({ async: true, type: 'GET', url: tgtURL, dataType: 'html', cache: false, }) .done(function(html){ var $div = $("#add"); $div.html(html); }) .fail(function(xhr, status, errorThrown){ alert("not found."); }); }
- ベストアンサー
- AJAX
- Ajaxで加工したページの初期化について
ページ上にテキストボックスやセレクトボックスがたくさんあります。 セレクトボックスAで選択した値に基づいて、セレクトボックスBやテキストボックスに一つの値を表示しています（セレクトボックスは選択不可状態になる）。 セレクトボックスAで選択しないときは、セレクトボックスBには予め選択肢が入っています。 セレクトボックスAで選択して、セレクトボックスBにデータを表示した後、 リセットボタンを押したらセレクトボックスBは初期状態の予め選択肢が入っている状態に戻したいです。 そして、セレクトボックスCには、別の選択肢を入れ直したいです。 このようなセレクトボックス、テキストボックスともに何十個もあるので、出来たら一括で初期状態に戻し、その後、セレクトボックスの選択肢の変更などのAjax加工をしたいと思っています。 ページのツールバーのページ更新ボタンを押すと、ページがリロードされて、初期化されるので、 window.location.reload(); と設定した後、さらにAjaxでセレクトボックスなどの変更をするプログラムを組んだのですが、 window.location.reload(); この後の処理が動いてくれません。 ページをリロードすると、その後の処理が無効？になってしまうのでしょうか。 一つずつセレクトボックスやテキストボックスのデータを削除して、さらに値をセットしてというのが効率が悪い気がして、 ページリロードのように、ページを初期化した後、必要なセレクトボックスやテキストボックスだけAjax処理をしたいなあと思うのですが、どのようにするのがいいのでしょうか。 効率のいいやり方をご存じの方がいらっしゃいましたらぜひ教えてください。 分かりづらいと思いますので、分からない点はご質問頂けたらと思います。 よろしくお願いいたします。
- ベストアンサー
- AJAX
- jQuery・Ajaxについて教えて下さい。
jQueryを使用した「Tipped」というツールチップ作成フレームワークを使用しています。 「ツールチップの上にさらにツールチップを表示する」ということが出来ず困っております。 ドキュメント http://projects.nickstakenburg.com/tipped/documentation 特定のクラス名の文字にカーソルを当てると、Ajaxにより外部HTML(PHP)の内容が小窓で表示されるというものです。 これを使って外部HTMLの表示をすることはできたのですが、 ツールチップ内に表示されるHTMLの中にさらに同名のクラス名を埋め込み、 そこにカーソルを当てたとき二重（入れ子）でツールチップを表示するということをしたいのですが、 最初の１つしか表示されません。 ■読み込む側(A.php) ～ 必要なファイルの読み込み ～ <span class='tipped' data-tipped='B.php'>カーソルを当てると「B.php」の内容を表示</span> <script type="text/javascript"> jQuery(document).ready(function() { Tipped.create(".tipped", { ajax: true }); }); </script> ～ ■読み込まれる側（B.php) <span class='tipped' data-tipped='C.php'>ここにカーソルを当てて「C.php」の内容を表示させたい</span> A.phpからB.phpのツールチップを表示することはできました。 B.phpからC.phpのツールチップを表示することもできますが、 A.phpに表示したB.phpからはC.phpのツールチップが表示できません。 Ajaxを使わず、B.phpに静的なツールチップを埋め込んだ場合も表示できませんでした。 wordpressの記事ページで動作させています。 必要なjsファイルは読み込んでおり、ファイルはそれぞれ同じ階層にあります。 何が問題で表示できないのでしょうか。どうかご教示をお願いします。
- ベストアンサー
- JavaScript
- jqueryのajax()内からグローバル配列に
jqueryのajax(){success: function()内からグローバル連想配列に値を格納したい。 jqueryのajax()でhtmlファイルを読み込み配列に格納。 その後他の関数で使いたいと考えていますが グローバル連想配列に格納できません。 success: function()内でさらに関数を定義もして見ましたが反応せず。。。 （プルダウンメニューを変更したら実行する関数） 以下ソースになります。 ----------------------------------------------------------- $(function() { objectarray = new Object(); $.ajax({ type: 'GET', url: 'hoge.html', dataType: 'html', success: function(data) { var text = []; $(data).each(function(i){ text = $(this).text().split("\n"); }); var alldata = $.grep(text, function(e){return e;});//空白やデータなしを削除 for(i=0; i<alldata.length; i++){ objectarray[i] = (alldata[i]); alert("forの中" + objectarray[i]);//取得できた } alert("forの外" + objectarray);//取得できた return objectarray;//あってもなくても変わらない。。。 }, error:function() { alert('問題がありました。htmlデータがありませんでした。'); } //return objectarray;←有効にするとjsが認識されなくなります。 }); alert("ajaxの外" + objectarray[0]);//何も表示されない、firebugでみるとobjectarrayには値が入っている。 }); ----------------------------------------------------------- 上記はnew Object()でやっておりますがnew Array()でも同じ結果でした。 回避策をご教授いただけましたら幸いです。 どうぞよろしくお願いいたします。
- ベストアンサー
- JavaScript
お礼
ありがとうございます キャッシュ回避手段がうまく出来ました。 それにしても江戸時代の雰囲気が素敵です