ベストアンサー

別ページのインラインフレームのアンカーに移動させる方法

2005/03/03 16:50

はじめまして、勉強になります。色々調べてやってみたのですがどうしてもうまく動作してくれません。やりたい内容は、あるページから同一ドメイン内のあるページに飛ばした時にアンカー情報（#～）付きで渡して、渡したページ先のインラインフレーム内のアンカーに移動させたいのです。下のソースでstr変数がうまく渡っていないのか、受け取り側のスクリプトがまずいのかが分かりません。（ちなみに途中で変数をモニターする方法があるのでしょうか？）一応次のページのURLバーには?以降のアンカー情報付きで表示されてはいるのですが、その?以降のアンカー情報がインラインフレームのURLに渡っていないような状態です。以下省略ソースです。【送信元】 <SCRIPT Language="JavaScript">  </SCRIPT> </head> <body ～ <img src="画像.jpg" onClick="watasu('#2')"> 【受信側　親ページ】 <script language="JavaScript" type="text/javascript">  </SCRIPT> <body ～ onLoad="jump2()">～ <IFRAME SRC="読み込むページ.html" name="インラインフレーム名" >～</IFRAME> どなたかヒントでもいいのでお力添えください…もしかして根本的なやり方がまずいのでしょうか。よろしくお願いいたします。

kdx500
お礼率100% (4/4)

JavaScript
回答数4
ありがとう数9

みんなの回答 （4）
専門家の回答

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

ベストアンサー

kappa_neko
ベストアンサー率50% (14/28)

2005/03/04 20:41 回答No.4

何度もすみません。読解力無さすぎですね。おれ。　・a.html 　・b.html 　・ifame.html -- a.html -- <html> <head> </head> <body> a.htmlです。 <div> <span><a href="#" onclick="location.href('./b.html?a');">aへ</a></span> <span><a href="#" onclick="location.href('./b.html?b');">bへ</a></span> <span><a href="#" onclick="location.href('./b.html?c');">cへ</a></span> <span><a href="#" onclick="location.href('./b.html?d');">dへ</a></span> <span><a href="#" onclick="location.href('./b.html?e');">eへ</a></span> <span><a href="#" onclick="location.href('./b.html?f');">fへ</a></span> </div> </body> </html> -- b.html -- <html> <head> <script> function hoge(){ hoge = location.search.substring(1); url = './iframe.html#' + hoge; window.open(url, 'iframe_area'); } </script> </head> <body onload="hoge();"> b.htmlです。 <iframe name="iframe_area" style="width:100%;height:50%"> </body> </html> iframe.htmlは、#2と同じ。

質問者

お礼 2005/03/04 22:34

あーーーー出来ました。window.openを使うんですか～！！自分にとっては発想の大転換です。（window.openは別窓を開くのに使うものとばかり思ってました）出来る人にとっては初歩的な所だと思うのですが、今回は大変勉強になりました。これを機に初歩的なところから勉強しようとつくづく思いました。何度も付き合って頂きありがとうございました。

その他の回答 (3)

kappa_neko
ベストアンサー率50% (14/28)

2005/03/04 14:11 回答No.3

a.htmlとb.htmlはフレーム分けされているのですか? こんな感じで。　・parent.html（フレーム定義をするhtml）　・a.html（上フレームに表示される）　・b.html（下フレームに表示される）　・ifame.html（b.html内でiframeに表示される） -- parent.html -- <html> <frameset rows="60px,*"> <frame name="control_frame" src="./a.html"/> <frame name="body_frame" src="./b.html"/> </frameset> </html> -- a.html -- <html> <head> </head> <body> a.htmlです。 <div> <span><a href="./iframe.html#a" target="iframe_area">aへ</a></span> <span><a href="./iframe.html#b" target="iframe_area">bへ</a></span> <span><a href="./iframe.html#c" target="iframe_area">cへ</a></span> <span><a href="./iframe.html#d" target="iframe_area">dへ</a></span> <span><a href="./iframe.html#e" target="iframe_area">eへ</a></span> <span><a href="./iframe.html#f" target="iframe_area">fへ</a></span> </div> </body> </html> -- b.html -- <html> <head> </head> <body> b.htmlです。 <iframe name="iframe_area" style="width:100%;height:50%"> </body> </html> iframe.htmlは、#2と同じ。

質問者

お礼 2005/03/04 19:04

度々ありがとうございます。 a.htmlとb.htmlはフレーム分けではなく、全くの別ページなので、a.htmlから直接target属性でiframeのnameを指定するとiframe.htmlが全画面で表示されてしまいます。やりたいのはこのときに、b.html内のiframeのアンカーポイントに移動させたいのです。＜イメージ図＞ ■a.html─■b.html 　　　　　　　└iframe.html ※a.htmlに<a href="./iframe.html#a"～など表記してますうまく説明できてないかもしれません。すみません。とにかくありがとうございます。

kappa_neko
ベストアンサー率50% (14/28)

2005/03/03 21:35 回答No.2

やりたいのは、こういうことですか？ 2つのhtmlファイルを作ってください。・main.html ・iframe.html です。 -- main.html -- <html> <head> </head> <body> <div> <span><a href="./iframe.html#a" target="iframe_area">aへ</a></span> <span><a href="./iframe.html#b" target="iframe_area">bへ</a></span> <span><a href="./iframe.html#c" target="iframe_area">cへ</a></span> <span><a href="./iframe.html#d" target="iframe_area">dへ</a></span> <span><a href="./iframe.html#e" target="iframe_area">eへ</a></span> <span><a href="./iframe.html#f" target="iframe_area">fへ</a></span> </div> <iframe name="iframe_area" style="width:100%;height:50%"> </body> </html> -- iframe.html -- <html> <head> <style> tr{ height : 100px; } </style> </head> <body> <table> <tr><td style="background:red;"><a name="a">aです。</a></td></tr> <tr><td style="background:blue;"><a name="b">bです。</a></td></tr> <tr><td style="background:red;"><a name="c">cです。</a></td></tr> <tr><td style="background:blue;"><a name="d">dです。</a></td></tr> <tr><td style="background:red;"><a name="e">eです。</a></td></tr> <tr><td style="background:blue;"><a name="f">fです。</a></td></tr> </table> </body> </html>

質問者

お礼 2005/03/04 12:55

回答ありがとうございます。試してみます。私の説明が分かりずらいからかもしれないのですが、やりたいことがうまく伝わっていない可能性がありますので補足させていただきます。 A.html と　b.htmlがあり、b.htmlの中でインラインフレームiframe.htmlを読み込んでいます。で、a.htmlのリンクに<a href="iframe.html#アンカー>と表記したのですが、アンカーポイントに飛びませんでした。b.htmlから<a href="iframe.html#アンカー>と書けば何も問題ないかとは思うのですが、どうしてもa.htmlから飛ばす必要がありますので、#アンカー部分を変数にしてb.html、iframe.htmlに渡せないかなと考えた次第です。ご参考までに具体的なサイトのurlを貼っておきます。 http://www.leilandgrow.com/leilandgrow/index_js_test.htm ここのindex.htmからliveevent.htmに飛ばし、cgiで生成したiframe内のアンカーポイント"#2"に飛ばしたいのです。よろしくお願いいたします。

argi
ベストアンサー率27% (5/18)

2005/03/03 17:56 回答No.1

単純にHTMLだけで以下の感じでやったらいけました。 --全体ページ(abc.html)-------------- <html> <body> aaaa<br> <IFRAME SRC="bbb.html#tobu"></IFRAME><br> bbbb<br> </body> </html> --IFRAMEページ(bbb.html)-------------- <html> <body> aaa<br> bbb<br> ccc<br> ddd<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br id="tobu"> kokonitobu?<br> <br> <br> <br> </body> </html> abc.htmlを開くとkokonitobu?の箇所に飛ぶはずです。ただ、インナーフレーム自体あまり推奨されてなかったと記憶していますが。

質問者

お礼 2005/03/04 12:38

回答ありがとうございます。できればhtmlのみでやりたいので試してみます。私の説明が分かりずらいからかもしれないのですが、やりたいことがうまく伝わっていない可能性がありますので補足させていただきます。 A.html と　b.htmlがあり、b.htmlの中でインラインフレームiframe.htmlを読み込んでいます。で、a.htmlのリンクに<a href="iframe.html#アンカー>と表記したのですが、アンカーポイントに飛びませんでした。b.htmlから<a href="iframe.html#アンカー>と書けば何も問題ないかとは思うのですが、どうしてもa.htmlから飛ばす必要がありますので、#アンカー部分を変数にしてb.html、iframe.htmlに渡せないかなと考えた次第です。ご参考までに具体的なサイトのurlを貼っておきます。 http://www.leilandgrow.com/leilandgrow/index.htm ここのindex.htmからliveevent.htmに飛ばし、cgiで生成したiframe内のアンカーポイント"#2"に飛ばしたいのです。よろしくお願いいたします。

質問者