• ベストアンサー

親、子、孫のウインドウを同時に表示するのは?

親と子のウンドウを同時に開くのは 親のファイルに以下のように書けば <HEAD> <SCRIPT LANGUAGE="JavaScript"> <!--// function openWindow() { window.open("","windowname"); } //--> </SCRIPT> </HEAD> <BODY> <A HREF="ko.html" onClick=openWindow() TARGET="windowname">子ウインドウ</A> </BODY> 出来るんですが、子のファイルに同じように書くと 子のウインドウが孫に変わってしまいます。 親、子、孫を同時に表示するのには、どうすればよいか、よろしくお願いします。

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

  • ベストアンサー
noname#199778
noname#199778
回答No.2

親ウィンドウのページのソースと、子ウィンドウのページのソースが同一であれば、それぞれのページで開こうとしているウィンドウの名前が同じになってしまうので、同じウィンドウに対してページを読み出そうとします。 結果的に、親ウィンドウから開いた子ウィンドウが再利用されて、子ウィンドウの中に孫ウィンドウに表示したいページが表示されてしまうでしょう。 これを回避するには、親ウィンドウで使っているウィンドウ名(target指定)と、子ウィンドウで指定するウィンドウ名(target指定)をそれぞれ別の名前にする必要があります。 具体的には、 window.open("","windowname"); この部分のwindownameと、 TARGET="windowname" このtarget属性で指定している名前を、親ウィンドウのページと子ウィンドウのページとで、別のものに指定すればよいでしょう。 例えば、親ウィンドウのページを <HEAD> <SCRIPT LANGUAGE="JavaScript"> <!--// function openWindow() { window.open("","childwindow"); } //--> </SCRIPT> </HEAD> <BODY> <A HREF="ko.html" onClick=openWindow() TARGET="childwindow">子ウインドウ</A> </BODY> とし、子ウィンドウに読み出すページの方は <HEAD> <SCRIPT LANGUAGE="JavaScript"> <!--// function openWindow() { window.open("","grandchildwindow"); } //--> </SCRIPT> </HEAD> <BODY> <A HREF="mago.html" onClick=openWindow() TARGET="grandchildwindow">孫ウインドウ</A> </BODY> のように、ページごとに次のウィンドウの名前を変えて指定する必要があると思います。 参考になれば。

giant18
質問者

お礼

詳しくご説明頂き有難うございます。早速やってみますと、うまくいきました。

その他の回答 (1)

noname#10926
noname#10926
回答No.1

子ウィンドウと孫ウィンドウに同じTARGET="windowname"を指定していませんか? 別名で記述しなければ別窓で開かないと思います。

giant18
質問者

お礼

回答有難うございました。おっしゃるとおり同じ名前でした。ご指摘感謝します。

関連するQ&A

  • 子ウィンドウから子ウィンドウ

    子ウィンドウから文字をクリックして、 同じ大きさの子ウィンドウを開かせたいのですが、 下記のJavaScriptでは子ウィンドウが開きません。 子ウィンドウから子ウィンドウを開かせるには どのようにしたらいいのでしょうか? ご回答宜しくお願い致します。 head内は、 <script type="text/javascript"><!-- function subwin(file){ window.open(file,"subwin","resizable=1, width=600, height=500, scrollbars=yes"); } //--></script> body内の呼び出し部分は、 <a href="ファイルのURL" onclick="subwin('ファイルのURL'); return false;">

  • javascriptでのエラーについて

    Windows7+IE8にて以下の処理を行いたいのですが、 ================================================== (1) 親ウィンドウ(oya_window.html)から、【window.open】にて   子ウィンドウ(ko_window.html)を開く (2) 子ウィンドウ(ko_window.html)の【window.opener】にて   親ウィンドウ(oya_window.html)に定義されている   【window.open】を実行する関数[openWindow]を呼び出し、   Yahooページを開く ================================================== (2)の部分で以下のエラーとなり、Yahooページを開く事ができません。 --------------------------------------------------------- このWebページのエラーにより、正しく機能しない場合があります。 --------------------------------------------------------- タグが無効です。 oya_window.html   ライン:10 コード:0      文字:5 --------------------------------------------------------- 同マシン(Windows7)のfirefoxでは問題なく処理が行えるため、IEの 何らかの設定に起因していると思うのですが、IEの何の設定に起因して いるのかわからず、困っています。 何か情報をお持ちの方いらっしゃいましたら、よろしくお願いします。 【その他情報】 ○IEをアドオンなしで起動しても同エラーが発生することから、IEの  アドオンによる影響ではないと思われます。 ○以下の処理は問題なく実行できます。  ▼パターンA  ==================================================  (1) 親ウィンドウ(oya_window2.html)から、【window.open】にて    子ウィンドウ(ko_window2.html)を開く  (2) 子ウィンドウ(ko_window2.html)にて(元々親ウィンドウ    (oya_window.html)に定義していた)【window.open】を実行する    関数[openWindow]を呼び出し、Yahooページを開く  ==================================================  ▼パターンB  ==================================================  (1) 親ウィンドウ(oya_window3.html)から、【window.open】にて    子ウィンドウ(ko_window3.html)を開く  (2) 子ウィンドウ(ko_window3.html)の【window.opener】にて    親ウィンドウ(oya_window.html)に定義されている    【document.bgColor】を実行する関数[changeColor]を呼び出し    親ウィンドウの背景色を灰色に変更する  ================================================== 【ソース】 ▼本来のパターン ==親ウィンドウ(oya_window.html)=================== <HTML> <HEAD> <TITLE>親ウィンドウ </TITLE> <script language="Javascript"> function koopen(){ window.open("ko_window.html","ko_window","status=yes,width=800,height=100"); } function openWindow(){ window.open("http://yahoo.co.jp","",""); } </script> </HEAD> <BODY> <a href="JavaScript:koopen();">子ウインドウを開く</a> </BODY> </HTML> ================================================== ==子ウィンドウ(ko_window.html)=================== <HTML> <HEAD> <TITLE>子ウィンドウ </TITLE> <script language="Javascript"> function helpop(){ window.opener.openWindow(); } </script> </HEAD> <BODY> <a href = "JavaScript:helpop();">Yahooページを開く</a> </BODY> </HTML> ================================================== ▼パターンA ==親ウィンドウ(oya_window2.html)=================== <HTML> <HEAD> <TITLE>親ウィンドウ </TITLE> <script language="Javascript"> function koopen(){ window.open("ko_window2.html","ko_window","status=yes,width=800,height=100"); } </script> </HEAD> <BODY> <a href="JavaScript:koopen();">子ウインドウを開く</a> </BODY> </HTML> ================================================== ==子ウィンドウ(ko_window2.html)=================== <HTML> <HEAD> <TITLE>子ウィンドウ </TITLE> <script language="Javascript"> function helpop(){ window.opener.window.open("http://yahoo.co.jp","",""); } </script> </HEAD> <BODY> <a href = "JavaScript:helpop();">Yahooページを開く</a> </BODY> </HTML> ================================================== ▼パターンB ==親ウィンドウ(oya_window3.html)=================== <HTML> <HEAD> <TITLE>親ウィンドウ </TITLE> <script language="Javascript"> function koopen(){ window.open("ko_window3.html","ko_window","status=yes,width=800,height=100"); } function changeColor(){ document.bgColor="CCCCCC"; } </script> </HEAD> <BODY> <a href="JavaScript:koopen();">子ウインドウを開く</a> </BODY> </HTML> ================================================== ==子ウィンドウ(ko_window3.html)=================== <HTML> <HEAD> <TITLE>子ウィンドウ </TITLE> <script language="Javascript"> function helpop(){ window.opener.changeColor(); } </script> </HEAD> <BODY> <a href = "JavaScript:helpop();">親ウィンドウの色を変える</a> </BODY> </HTML> ==================================================

  • 子ウィンドウから親ウィンドウのテキストフィールドにデータを表示する

    子ウィンドウのリンクをクリックするとそのリンクの内容が親ウィンドウのテキストフィールドの中に表示されるというのを作りたいのですが、 親ウィンドウ <html> <head> <title>サブウィンドウから親ウィンドウのテキストフィールドにデータを表示する</title> <script language="JavaScript" type="text/JavaScript"> <!-- function MM_openBrWindow(theURL,winName,features) { //v2.0 window.open(theURL,winName,features); } //--> </script> </head> <body> <a href="javascript:;" onClick="MM_openBrWindow('subwindow.html','','width=160,height=160')">open</a> <form name="myFORM"> <input type="text" name="tBox"> </form> <form name="myFORM2"> <input type="text" name="tBox2"> </form> </body> </html> 子ウィンドウ <html> <head> <title>サブウィンドウから親ウィンドウのテキストフィールドにデータを表示する</title> <script Language="JavaScript"> <!-- function setData() { window.opener.document.myFORM.tBox.value="灯油ストーブ"; } function setData2() { window.opener.document.myFORM2.tBox2.value="シャワー"; } // --> </script> </head> <body> <a href="#" onClick="setData()">灯油ストーブ</a> <a href="#" onClick="setData2()">シャワー</a> </body> </html> これではリンク数とテキストフィールド数が同じじゃないといけないですよね。 作りたいのはテキストフィールドは15個あって、リンクの方は70個ぐらいあります。リンクをクリックするとテキストフィールドの中へ順々に表示させたいのですが、どうしたらよいのでしょうか? どうかアドバイスをお願いいたします。

  • 新しい子ウィンドウを開くと古い子ウィンドウのすぐ上に表示されるようにしたい。

    Javascript初心者です。わかりやすく具体的に教えてください。 親ウィンドウから画像1、画像2にリンクを張り、それぞれ子ウィンドウとして開きます。 現在はつぎのようにしています。 <script type="type/javascript"> function wopen1{ window.open('画像1のURL','new1',scrollbars=no,resizable=no,width=420,height=280');} function wopen2{ window.open('画像2のURL','new2',scrollbars=no,resizable=no,width=300,height=450');} </script> <body> <a href="#" onClick="wopen1()">画像1</a> <a href="#" onClick="wopen2()">画像2</a> </body> これだと画像1を開いた後に画像2を開くと階層的(レイヤー的?)に上から順に「画像2の子ウィンドウ>親ウィンドウ>画像1の子ウィンドウ」と表示されます。 これを「画像2の子ウィンドウ>画像1の子ウィンドウ>親ウィンドウ」の順で表示されるようにしたい。 また、画像2を開いた後に画像1を開く場合は同様に「画像1の子ウィンドウ>画像2の子ウィンドウ>親ウィンドウ」となるようにしたい。 どうしたらよいでしょうか? よろしくお願いします。

  • HTAで,親ウインドウを閉じると同時に子ウインドウも閉じる

    HTAを使っています。 *.htaのファイルにjavascriptを下記のとおり書いています。 目的は,親ウインドウで「閉じる」というボタンを押すことで 親ウインドウを子ウインドウを閉じるという動作をさせることです。 概ね上手く動きますが,子ウインドウが既に閉じられている状況で実行すると,「リモートサーバマシンが存在しないか,利用できません。」とエラーになります。 WINDOWS2000では問題無く動きますが,XPだとエラーが表示されます。 どうすれば,子ウインドウの状況によらず正常に動作するでしょうか? ########################################################## <input type="button" value="終了" onclick="closeWindow()" class="tukuru"> var subWin=""; //subWinをグローバル変数として宣言 function closeWindow(){ item1.style.display=""; setTimeout("end()",2000); } function end(){ if ( subWin.closed == false ) {; if(subWin.name+''=='OpenWindow'){; subWin.close(); }; }; window.close(); }

  • 親ウインドウから子ウインドウと同時にID

    親ウインドウから、子ウインドウを開く際に、子ウインドウ内のID=”レイヤー″を同時に呼び、子ウインドウを変化させるスクリプトがありましたら教えてください。 ID="レイヤー"は複数です。

  • 親タブから子タブ開いて親タブへ戻す。

    以前、ここで質問をしたものです。 まだ、解決していません。 window.opener.focusが利かないと質問したものです。 親タブ(ウインドウ)から子タブ(ウインドウ)をひらいて そのリンク先を親タブ(ウインドウ)で制御しようとしています。 自分でいろいろやりましたが、現在chromeのみで動いています。 Firefox、IEでは動いていません。 他に良い方法はないでしょうか? 現在のコードです。 親<index.html> <html> <head> <title>TOPページ</title> <script type="text/javascript"> <!-- var win; // サブウィンドウを開く処理 function disp(url){ win = window.open(url, "oya"); } // --> </script> </head> <body> <p><a href="example_sub8.html" target="_blank" onClick="disp('example_sub8.html')">testサブウィンドウを開く</a></p> </body> </html> 子ウインドウ<example_sub8.html> <html> <head> <title>testサブウインドウ</title> <script type="text/javascript"> <!-- // リンクの処理開始 function disp(url){ if(!window.opener || window.opener.closed){ // メインウィンドウの存在をチェック window.alert('メインウィンドウがありません'); // 存在しない場合は警告ダイアログを表示 } else{ window.blur(); window.opener.focus(); window.open(url,"oya"); //window.opener.location.href = url; // 存在する場合はページを切りかえる } } // リンクの処理終了 // --> </script> </head> <body> <ul> <li><a href="#" onClick="disp('index.html'); return false;">トップページ</a></li> <li><a href="#" onClick="disp('index2.html'); return false;">test2ページ</a></li> </ul> </body> </html>

  • ページを表示すると同時に複数のサブウィンドウを開く方法について

    ページを表示すると同時に複数のサブウィンドウを開く方法について、 プログラムを作成したらよいのか教えてください。 下記のプログラムは、ページを表示すると同時に1枚のサブウィンドウを開くプログラムですが、3枚ほどサブウィンドウを開きたいのです。 よろしくお願い致します。 <HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- // サブウィンドウの表示方法を指定する function openWindow1() { window.open("sample.html","OpenWindow",scrollbars=no,location=no,menubar=no,toolbar=no, status=no,directories=no,resizable=no"); } //--> </SCRIPT> </HEAD> <BODY bgcolor="#ffffff" onLoad="openWindow1()"> </BODY> </HTML>

  • 子ウィンドウの情報を取得したい

    window.openを複数行い、各ウィンドウの情報を取得したいのですが 配列変数などで管理せずwindowなどで取得は可能でしょうか? 試しに作成したソースです --ココカラ(oya.html)-- <html> <head> <script type="text/javascript"> <!-- //この方法で取得ができるが var koList = new Array(); function openKoA(){ kowin = window.open("ko.html", "kowin" + koList.length); koList.push(kowin); } function koListA(){ for(i in koList){alert(koList[i].document.getElementById("t1").value);} } // 配列で管理せずにwindow等にある情報で取得したい function openKoB(){ window.open("ko.html"); } function koListB(){ alert("子供リストなど"); //window.childNodes とか } --> </script> </head> <body> <input type="button" value="openKoA" onclick="openKoA()"> <input type="button" value="koListA" onclick="koListA()"> <br> <input type="button" value="openKoB" onclick="openKoB()"> <input type="button" value="koListB" onclick="koListB()"> </body> </html> --ココマデ(oya.html)-- --ココカラ(ko.html)-- <html> <body> <input type="text" id="t1" value="aa"> </body> </html> --ココマデ(ko.html)-- 以上、よろしくお願いします。

  • 親html内の要素を新しいウィンドウで表示するには

    宜しくお願い致します。 親htmlとして閲覧している時には表示されない特定のdiv要素を「表示する」といったようなボタンをクリックすることで、子ウィンドウに読み込ませて表示させることができるコードを探しております。 通常、親htmlから子ウィンドウを表示させるには、子ウィンドウに読み込むhtmlファイルを別に用意し、親htmlから子ウィンドウを表示させるのが普通かと思うのですが、事情があり、子ウィンドウ用のhtmlを用意できません。 なので、親htmlに子ウィンドウとして読み込ませるdiv要素を書き、親htmlとして閲覧している時はdisplay:none;のような感じで非表示にしておき、「子ウィンドウを開く」などといったボタンをクリック、子ウィンドウに親htmlに書かれているdiv要素を読み込んで表示させる、というようなことはできないものかと思っております。 やりたいことが抽象的で、検索しても思うような事例が見つからないため、こちらで質問させて頂きました。 子ウィンドウを開くためのコードは下記のようになっております。 ■親html <html> <head> <script type="text/javascript"> <!-- function gene_window(mypage, myname, w, h, scroll) { var win_width = (screen.width - w) / 2; var win_height = (screen.height - h) / 2; win_detail = 'height='+h+',width='+w+',top='+win_height+', left='+win_width+',scrollbars='+scroll+',resizable' win = window.open(mypage, myname, win_detail) if (parseInt(navigator.appVersion) >= 4) { win.window.focus(); } } --> </script> </head> <!--普通に表示する部分--> <div> <a href="●●" onClick="gene_window(this.href, 'name','500','400','yes');return false;">子ウィンドウを開く</a> </div> <!--子ウィンドウとして表示したい部分※親htmlでは非表示--> <div style="display:none">hogehoge</div> </body> </html> 子ウィンドウを開くと、<div style="display:none">hogehoge</div>の部分だけが子ウィンドウに読み込まれ、<div>hogehoge</div>として表示される。 分かりにくい説明で申し訳ありません。 補足説明致しますので、もしお分かりの方がいらっしゃいましたら、どうかご教授下さいますようお願い致します。

専門家に質問してみよう