スクロール位置に関する質問

このQ&Aのポイント
  • PHP4で作成されたウェブページで、親ウィンドウのスクロール位置に関する問題が発生しています。
  • 子ウィンドウを閉じるときに親ウィンドウをリロードする処理を行っていますが、その際に親ウィンドウのスクロール位置がトップに戻ってしまうという現象が起きています。
  • リロード処理はJavaScriptを使用しており、F5キーの更新処理ではスクロール位置が正しく更新されるため、JavaScriptからの指定でもうまくいくのではないかと考えています。
回答を見る
  • ベストアンサー

スクロール位置に関してです

お世話になります PHP4でHP作成しています Windowのスクロール位置に関して質問させて下さい 親Windowから子Windowを呼び出して 子Windowを閉じるタイミングで 親Windowのリロード処理を行っています そこで、親Windowのスクロール位置がTopに戻ってしまう現象が起きてしまい 困っています リロード処理はJavaScriptを使用して  echo "<script type='text/javascript'>";  echo "window.close();";  echo "window.opener.location.reload();";  echo "</script>"; と書いています 通常F5キーの更新処理を行うと スクロール位置が更新前の位置にセットされるので JavaScriptからの指定も上手く行くのではないかと思ったのですが… 宜しくお願いします

質問者が選んだベストアンサー

  • ベストアンサー
  • auty
  • ベストアンサー率58% (284/486)
回答No.2

>>> 親Window内のデータが多くリロードに時間がかかっている のが原因かも知れませんが… なるほど私の場合、親ウィンドウは、887バイトでしか確認していませんでました。 そこで、次の方針でサンプルを作ってみました。 ・ IEのみに以下の対処をする。判断には、「document.attachEventが使えるかどうか」を利用する。 ・ 親ウィンドウを一旦閉じ、新たなウィンドウを開く。 ・ そのとき、y=スクロール位置(scrollTop) をクエリ情報として加える。   URL?line=y 以上を実際に適用する場合他の他の利用条件とトラブルになることも考えられますので何かありましたらお知らせください。 以下のコードを参考にしてみてください。 windowcontrol4_2.html ------------------------------------------------------------ <html> <title>window control3</title> <script type="text/javascript"> <!-- var win2 = false; function init() { var arr=Array(); var querys=location.search; if(querys) { var q = querys.replace(/^\?/,'').split('&'); for(i=0 ; i<q.length ; i++){ var pair=q[i].split('='); arr[pair[0]]=pair[1]; } window.scrollTo(0,Number(arr['line'])); } } function openWin() { win2=window.open('controlwin4_2.html', 'newwin', 'toolbar=no, location=no, status=no, menubar=no, scrollbars=no, width=180, height=250'); } function closeWin() { if( win2 && !win2.closed ) { win2.close(); } else { alert("すでにウィンドウは閉じられています"); } } //--> </script> <body onload="init()"> <h3>親ウィンドウのコントロール</h3> <hr /> <form> <input type="button" value="New Window" onclick="openWin()" /> <input type="button" value="Close ChildWindow" onclick="closeWin()" /> <br /> A <br /> A <br /> A <br /> A <br /> A <br /> A <br /> A <br /> A X <br /> X <br /> X <br /> X <br /> X <br /> X <br /> X <br /> X <br /> X <br /> X <br /> X <br /> X <br /> X <br /> X </form> </body> </html> ------------------------------------------------------------ controlwin4_2.html ------------------------------------------------------------ <html> <title>Window Control</title> <script type="text/javascript"> <!-- function reloadWin() { if(!opener.closed) { if(document.attachEvent) { var y= window.opener.document.body.scrollTop; window.opener.close(); window.open('windowcontrol4_2.html?line=' + y, 'windowcontrol4_2', ''); } else { window.opener.location.reload(); } window.close(); } } //--> </script> <body> 新しいウィンドウから親のウィンドウを操作 <hr /> <form> <input type="button" value="Window reload" onclick="reloadWin()" /> </form> </body> </html>

niko06
質問者

お礼

お世話になります お礼遅れまして申し訳無いです 教えて頂いた内容からヒントを得まして出来ました! 力技ですが… ////////////////////////////////////////////////////////////////////// ---------------------------------------------- 子ウィンドウ(終了処理部) ---------------------------------------------- <script type='text/javascript'>  var y= window.opener.document.body.scrollTop;  lmt = new Date();  lmt.setTime(lmt.getTime() + (1000 * 60 * 3));  lmt2 = lmt.toGMTString();  document.cookie = "SCROLLTOP="+y+"; expires="+lmt2;  window.opener.location.reload();  window.close(); </script> ---------------------------------------------- 親ウィンドウ ---------------------------------------------- <html> <head> <meta http-equiv="content-script-type" ontent="text/javascript"> <script type="text/javascript"> <!-- function scrollWin() {   val=GetCookieData("SCROLLTOP");   if(val!=""){window.scrollTo(0,val);} } function GetCookieData(kyword) { if(typeof(kyword) == "undefined") // キーワードなし return ""; // 何もしないで戻る kyword = kyword + "="; kydata = ""; scookie = document.cookie + ";"; // クッキー情報を読み込む start = scookie.indexOf(kyword); // キーワードを検索 if (start != -1){ end = scookie.indexOf(";", start); // 情報の末尾位置を検索 kydata = unescape(scookie.substring(start + kyword.length, end)); } return kydata; } //--> </script> </head> <body background="img/back.jpg" onLoad="scrollWin()">  :  : </body> </html> ////////////////////////////////////////////////////////////////////// 3分を期限としてクッキーに情報をためこみ 親Load後にスクロールするようになっています ありがとうございました。大変助かりました。

その他の回答 (1)

  • auty
  • ベストアンサー率58% (284/486)
回答No.1

>>> 親Windowのリロード処理を行っています そこで、親Windowのスクロール位置がTopに戻ってしまう現象が起きてしまい 困っています この現象は、IEのときに起こるようですが、 スクロール位置(scrollTop)を記憶しておき、リロード後そこに戻ればいいと思います。 以下のコードを参考にしてみてください。(y方向のみの場合) ------------------------------------------------------------ var y= window.opener.document.body.scrollTop; window.opener.location.reload(); window.opener.scrollTo(0,y);

niko06
質問者

お礼

お世話になります 回答有難う御座います 教えて頂いた処理を組み込んで試してみた所 やはりTopに戻ってしまうようです 記述は // Windowを閉じる echo "<script type='text/javascript'>"; echo "var y= window.opener.document.body.scrollTop;"; echo "window.opener.location.reload();"; echo "window.opener.scrollTo(0,y);"; echo "window.close();"; echo "</script>"; と子Windowの終了処理を変更してみました 親Window内のデータが多くリロードに時間がかかっている のが原因かも知れませんが…

関連するQ&A

  • 親ウインドのASPをリロードさせたい

    題名通りで、子ウインドをCloseする際に、親ウインドをリロードさせたいんです。 子ウインドで、 <Script Language="JavaScript"> window.opener.location.reload() window.close() </Script> と書いてみたんですけど、変わってる形跡が無いんですー(-_-;)

  • javascript の locationメソッド

    Javascript で、子(サブ)ウィンドを使っています 子ウィンドを開いて、とある処理を終了後に親ウィンドに指定のURLを表示させて子ウィンドを閉じる、という処理をしたいと思っています。 まず、親ウィンドにURLを渡すところはうまく動きます。 そのページはPHPで作られたページで、できており子ウィンドの処理でセッションに保存されたセッション変数を読み込んで動きます。 ページは遷移するのですが新しいセッション変数が読み込まれません。 ページをリロードすれば動作するので、子ウィンドを閉じる前に親ウィンドを再読込させればよいかな?と思ってreloadを入れてみました。 すると、リロードはしているようなのですが、今度は渡したURLに遷移しなくなってしまいました。 window.opener.location.replace(URL); window.opener.location.reload('true'); window.close(); このような処理はどうすればよろしいでしょうか? それとも諦めるしかありませんか? また、過去に同様な質問があるようでしたら、そのurlを教えていただけると幸いです。 見つけたのですが、探しきれませんでした。

  • サブウィンドウから、別のサブウィンドウをリロードさせたいのですが、できるのでしょうか?

    A.html(親ウィンドウ)から、子ウィンドウ(B.html)と子ウィンドウ(C.html)があります。 子(C.html)から、子(B.html)へリロードさせたいのですが、うまく行きません。 window.opener.Bウィンドウの名前.location.reload(); close()などは、子から子でもうまく行くのですが、reload()は不可能なのでしょうか? どなたか、教えてください。お願いします。

  • JavaScriptでのリロードについて

    ネットで調べていましたが解決する事ができませんでしたので投稿しました。 宜しくお願いします。 ページ間の制御について質問します。 Aページから別ウィンドウを開いてBページを表示しています。 Bページではデータの入力画面→確認画面→完了画面の流れで処理をしています。 Bページの完了画面には別ウィンドウでCページを表示するボタンがあります。 ※Cページを表示する際にBページを閉じています。 Cページではファイルのアップロード画面→確認画面→完了画面の流れで処理をしています。 Cページの完了画面にはCページを閉じてAページをリロードしていますがうまく更新できません。 JavaScriptのソースは下記の通りです。 if(!window.opener || window.opener.closed){ } else{  window.opener.location.reload(); } window.close(); ※このJavaScriptはCページのボタンのonClickに指定しています。 試しに単体で下記のJavaScriptのソースを指定してみましたが駄目でした。 window.opener.opener.location.reload(); どのようにすればCページを閉じてAページをリロードする事ができますか。 似たような内容で申し訳ありませんがご教授、宜しくお願いします。 では、失礼します。

  • JavaScriptでページを一度だけリロード

    とあるページにアクセスした際、JavaScript(jQuery)を使って一度だけページをリロードしたいと思っております。 <script language="JavaScript"><!-- function reload() { if (window.name != "test") { location.reload(); window.name = "test"; } } // --></script> 上記のような記述で試みたのですが、リロードしてくれません。 他に対応できる方法がございましたら、ご教授いただけますと幸いです。 以上、よろしくお願い致します。

  • 1回だけリロードしたい

    開いたときに1度だけリロードさせたいのですが、たのページを参考に <script language="javascript"> <!-- if ( location.search.indexOf("1") == -1 ) { setTimeout("_reload()",1000); } function _reload() { location.href = location.href + "?1"; } //--> </script> を入れてみたのですが、リロードはされるものの、いわゆるブラウザの「更新」ボタンとは違うらしく、POSTで送られてきたデータを破棄した状態でリロードされるため、データの取得ができず困っています。 データを保持したままのリロード、つまりブラウザの「更新」ボタンのようなリロードを1度だけさせるにはどうしたらよいか教えてください。

  • Fire FoxでWindow Closeを有効にする

    Fire FoxでJavaScript Close Windowが効かない・・・ ということで、以下ScriptをHead内に <script type="text/javascript"> function clsWin(){ window.opener = window; var win = window.open(location.href,"_self"); win.close(); } </script> を記入し、HTML内には <INPUT type="button" value="Close" onclick="close_win()"> と記入したのですが、 やはり反応がありません・・・。 どなたかご存知の方、教えてください!

  • window.close()?でエラー

    javaScriptのwindow.close()で「プログラムにコマンドを送信している時に、エラーが発生しました」と言うエラーが出てしまいます。 但し、Windowは正常にクローズされています。 親画面から子画面をオープンし、子画面のオープン後に親画面自身をクローズしている処理です。 window.opener = window; window.close(); でクローズしています。 宜しくお願いします。

  • location.replaceについて

    親ページから子ページを表示います。 ※JavaScriptのwindow.openで子ページを開いています。 子ページにはテキストボックス等を配置していて項目を入力したら[閉じる]ボタンを押下して子ページを閉じて子ページで入力された値で親ページを再表示して反映させていますがここで1つ問題が発生してしまいました。 ※子ページの[閉じる]ボタンにはonClickでJavaScriptを設定しています。 JavaScriptの内容は下記の通りです。 function closeScript(){   window.opener.location.reload();   window.close(); } 押下すると「再試行」のダイアログが表示されてしまって・・・ ネットで検索して調べてみたら「再試行」のダイアログの制御はできないとの事でした。 再度、ネットで調べていたら下記のような記述がありました。   location.replace(location.href); 上記のJavaScriptを下記のように変更して子ページの[閉じる]ボタンを押下してみたら「再試行」のダイアログが表示されず、子ページを閉じる事が出来ました。 しかし、親ページは何も反応がないような・・・ そこで皆さんに質問があります。 「location.replace(location.href);」が何をやっているのかをネットで調べてみましたが・・・ 「location.replace」・・・「指定したページへ移動する」との事でした。 「location.href」・・・現在表示しているページのアドレス(URL)を示す文字列です。 上記のスクリプトは何を行っているのでしょうか。実際に動かしてもうんともすんとも言わないので・・・ くだらない質問で申し訳ありませんがわかりやすく教えていただけませんでしょうか。 宜しくお願いします。

  • リロード

    すいません。私JavaScriptはまったくの素人です。 あるページを5分ごとにリロードさせたくて、 <script language="JavaScript"> <!-- function reload_me() { document.location.reload(); setTimeout("reload_me()",300000); } //--> </script> <BODY onLoad="reload_me()"> と書いたところ、ロードしてくると同時に次のロードが始まってしまい、 300000という時間が全くきいてないような感じです。 (間髪を入れず無限にリロードが続いている状態) <body>のonLoadに書いてはいけないのでしょうか? それとも書き方がよくないのでしょうか? よろしくお願いします。

専門家に質問してみよう