- ベストアンサー
ＡＪＡＸでの自動リロード方法
- ＡＪＡＸを使用した自動リロード方法について教えてください。
- javascriptを使用してページを一定時間で自動リロードする方法について教えてください。
- ＡＪＡＸにおけるページの自動リロード方法について詳しく教えてください。
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
私はあまりライブラリーを使わず自分でプログラムを書く方なので、一通りの機能を書いていますが、ざっくり書くと以下のような感じです。 そもそもAjaxとはどんな物かお分かりだという前提ですが、 createXmlHttpRequest関数はJavascript上でのHTTPクライアントを生成する関数です。 ブラウザによって処理の仕方が多少違うので、だいたいのブラウザに対応できるようにしたものです。 getAjaxData関数はAjaxを使ってサーバからデータをGETメソッドで取ってきて、<div id="ajax"></div>の間に書き込む処理をします。 そして、setInterval() で1秒に一回getAjaxData関数を呼び出しています。 setTimeout() だと一回限りなので、繰り返し一定間隔でコンテンツを書き換えるなら setInterval() がいいと思います。 <html> <head> <script type="text/javascript"> <!-- function createXmlHttpRequest() { var xmlhttp = null; try { xmlhttp = new XMLHttpRequest(); } catch(e) { try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) { try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) { return null; } } } return xmlhttp; } function getAjaxData() { xmlhttp1 = createXmlHttpRequest(); if (! xmlhttp1 || xmlhttp1.readyState == 1 || xmlhttp1.readyState == 2 || xmlhttp1.readyState == 3){ return; } xmlhttp1.open("GET", "./hoge.php", true); xmlhttp1.onreadystatechange = function() { if (xmlhttp1.readyState == 4 && xmlhttp1.status == 200) { document.getElementById("ajax").innerHTML = xmlhttp1.responseText; } } xmlhttp1.send(null); } setInterval("getAjaxData()", 1000); //--> </head> <body> <div id="ajax"><!-- Ajaxで書き換える部分 --></div> </body> </html>
その他の回答 (2)
- yyr446
- ベストアンサー率65% (870/1330)
目的はなんだろう？ そもそも、AJAXはおろか、Javascriptもいらないじゃないか．．． <meta http-equiv="refresh" content="300"> SEOはよく知らんけど..
補足
ご回答あありがとうございました！ 確かに上記の方法でもjavascript でも実現は可能ですが、リロードした 際に画面が初期の状態（スクロールしてあっても最上部へ戻ってしまう）に なってしまいますが、ajax を使用した場合はそれがないかと。。。 私の仕入れた情報が間違っているのかもしれませんが、、、、
- t_ohta
- ベストアンサー率38% (5292/13826)
ReloadAddr関数の中の window.location.reload(); の替わりにAjaxを使ってページ内を書き換える処理を入れるだけです。
補足
ご回答ありがとうございます。 ajax に関して無知なもので申し訳ありません。 ajax を使用してページを書き換える記述はどのように記述したら良いでしょうか。。。 教えて頂ければ幸いです。 よろしくお願いしいます。
補足
ありがとうございました！ なんとかできるようになりました。