URLを引数とし、フレーム間で渡す方法

前へ 次へ
このQ&Aのポイント
  • WEBページでフレーム間でURLを引数として渡す方法についてご教授ください。
  • 現在開発中のWEBページでフレーム間の情報共有が必要ですが、URLを引数としてフレーム間で渡す方法がわかりません。
  • 左右分割されたフレーム間でURLを引数として渡す方法について教えてください。
回答を見る
  • ベストアンサー

URLを引数とし、フレーム間で渡す方法

こんにちわ。 現在開発しているWEBページで、困っています。 まず、最初のページで、フレームが左右に分割しています。 左フレームAはリンクがたくさんはってあります。 右フレームBはトップロゴがあります。 右フレームBのロゴを押すと、右フレームはさらに上下に分割し、上フレームCはヘッダーとして使用し、下フレームDは詳細画面になっています。 左フレームAのリンクを押すと、下フレームDの内容が変わるのですが、フレームが4つ（A,B,C,D）に分割される前に左フレームAのリンクを押してしまうと、新しくブラウザが開かれてしまいます（Targetがないため） そこで、URLを引数として、上下画面にフレーム分割をするソースに受け取った引数URLをフレームセットで実行できないかと考えました。 ・・・がサンプルなどをひっくり返しても、なかなかできません。 どなたかご教授していただけるととても助かります。 よろしくお願いいたします。

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

  • ベストアンサー
noname#3852
noname#3852
回答No.3

この方法でお気に召すでしょうか。 <!-- main.html --> <html> <frameset cols="20%,*"> 　　<frame name="A" src="a.html" /> 　　<frame name="B" src="b.html" /> </frameset> </html> <!-- a.html --> <html> <head> <script language="JavaScript"> function func( ancObj ) { 　　// フレームＢがなければ、とりあえず無視 　　if ( !parent ) 　　　　return false; 　　if ( !(parent.B) ) 　　　　return false; 　　// フレームＢの中にフレームＤがなければ、フレームＢを更新。 　　// その際、フレームＤの移り先も合わせて送信 　　if ( !(parent.B.D) ) { 　　　　parent.B.location.href="b.html?frameD=" + ancObj.href ; 　　　　return false; 　　} 　　// フレームＤがあれば、ハイパーリンクでジャンプさせて良し 　　return true ; } </script> </head> <body> 　　<a href="http://www.yahoo.co.jp/" target="D" 　　　　onclick="return func(this)">Yahoo!</a><br /> 　　<a href="http://www.google.com/" target="D" 　　　　onclick="return func(this)">Google</a><br /> </body> </html> <!-- b.html --> <html> <body> 　　<a href="b2.html">さらに分割</a> </body> </html> <!-- b2.html --> <html> <script language="JavaScript"> function funcOnLoad( ) { 　　var searchs =""; // ＵＲＬのパラメータ部分 　　var key = "" ; // 検索パラメータ 　　var keyHead = 0; // パラメータの先頭位置 　　var keyTail = 0; // パラメータ＋値の終了位置 　　var urlOfFrameD = "" ; // フレームＤのジャンプ先 　　// パラメータ文字列の取得 　　searchs = location.search; 　　if ( searchs.length == 0 ) 　　　　return; 　　// frameDというパラメータ検索 　　key = "?frameD=" ; 　　keyHead = searchs.indexOf( key ); 　　if ( keyHead < 0 ) { 　　　　key = "&frameD=" ; 　　　　keyHead = searchs.indexOf( key ); 　　　　if ( keyHead < 0 ) 　　　　　　return ; 　　} 　　// 値の終了位置を検索 　　keyTail = searchs.indexOf( keyHead + key.length, "&" ); 　　if ( keyTail < 0 ) { 　　　　urlOfFrameD = searchs.substring(keyHead + key.length); 　　} else { 　　　　urlOfFrameD = searchs.substring(keyHead + key.length, keyTail); 　　} 　　if ( urlOfFrameD.length == 0 ) 　　　　return ; 　　// ジャンプ 　　D.location.href = urlOfFrameD ; } </script> <frameset rows="20%,*" onLoad="funcOnLoad( )"> 　　<frame name="C" src="c.html" /> 　　<frame name="D" src="d.html" /> </frameset> </html> ちょっと長いですが、順を追うと、まず、main.htmlを表示させます。main.htmlは、フレームで左右にa.htmlとb.htmlとに分割されてます。b.htmlはリンクがあり、選ぶとb2.htmlとなり、その中で上下にc.html、d.htmlとなります。 a.htmlには、リンクがあります。今回、onclick属性をつけて置き、returnします。<a>タグでは、onclickからtrueが戻るとhrefで指定したURLにジャンプします。falseが戻るとジャンプしません。 さて、リンクを押されると、親フレームとフレームBがいるか確認します。いない場合は、今回は何もしません。 次にフレームBにフレームDがいるか確認します。いれば、trueを戻してそのままジャンプさせます。 いない場合、まず、フレームBをC、Dに分割させるため、b2.htmlにジャンプします。この際、<a>タグのhrefで指定していたURLもframeDというパラメータとして渡します。フレームAでの作業はここまでです。この際、trueを戻すと別ウィンドウが開くと思うので、何もさせないためにfalseを戻します。 　次に、C、Dと分割させられたフレームBですが、このとき、HTMLソースは、b2.htmlに切り替わります。<frameset>タグにonload属性があります。<frameset>や<body>にonload属性があると、そのhtmlの表示が完了した際に、その属性の内容が実行されます。 　onload属性内では、まず、このページを表示するためのＵＲＬにパラメータがあるか確認します。これは、(windows.)location.searchを調べれば判ります。 次にパラメータにframeDが含まれているか確認にして、あれば、その値（文字列）だけを抽出します。 抽出が終われば、フレームDのURLを変更するだけです。 内容が込み入ってますが、alert()を挟むなどして、順番に追えば、理解出来ると思います。もし、この内容で大丈夫そうと思えたら、構築するシステムに合わせてカスタマイズしてみてください。

その他の回答 (3)

noname#3852
noname#3852
回答No.4

ANo.#3の回答したnisikitです。ソースの訂正です。 a.htmlの１３行目あたりの parent.B.location.href="b.html?frameD=" + ancObj.href ; となっている箇所は、 parent.B.location.href="b2.html?frameD=" + ancObj.href ; の誤りです。 誤）b.html -> 正）b2.html です。

cat_tomato
質問者

お礼

思ったとおりに動作しました。 大変感謝しております。 ありがとうございました。 また、上記誤りは気づきました。 大丈夫です。 本当にありがとうございました。

  • madman
  • ベストアンサー率24% (612/2465)
回答No.2

・トップロゴを押す前に、左フレームのボタンは押せないようにする。 トップロゴ表示時には1フレームにして、左フレームのボタンも出さない。もしくは、出しておきたいのであれば（押せないのに出しても意味無いと思いますが）クッキーなどで制御。 ・ダミーフレームをつくり、最初から４フレームで表示する。 ぐらいしか思いつきません。

  • rittan
  • ベストアンサー率36% (38/103)
回答No.1

答えになってないかも知れませんが、 Cookieを使えば宜しいかと…（^_^;l||） トップロゴの表示の際、フレームが分割されてないとの情報をCookieに書き込めば、あとはフレームAからCookie参照で制御できると思いますが、いかがでしょうか？

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • HP　フレームページを開き、更にページを開きたい

    左右に分割されているフレームがあります。 indexページから <A href="illust.html" target="top">フレーム</a> とリンクさせており、フレームページに飛びます。 左フレームに「Ａ」、「Ｂ」、「Ｃ」、「Ｄ」と…リンクが張ってあり、 「Ｂ」をクリックすると、右フレームに「Ｂ」ページが表示されます。 <A href="b.html" target="right" >Ｂ</a> indexページから、フレームにリンクさせたら、フレームページが開かれますが、 さらに「Ｂ」ページを開いた状態にすることは可能でしょうか？ 今の状態だと、フレームページが開かれるだけで、手動で左フレームから「Ｂ」をクリックするのが手間なのですが…。 ビルダー等のソフトは使用しておらず、メモ帳でタグを書いています。

    • ベストアンサー
    • HTML
  • 1か所をクリックして複数ページを切り替える方法を教えてください。

    左にＡというページ、右ページを上下２つに分割（Ｂ・Ｃ）しています。 Ａにある文字をクリックしたらＢ・Ｃが同時に切り替わるタグを教えてさい。 （どこページに何を記載すればいいのか、Ａにあるクリックする文字のところに書くことなど） わかりにくい説明ですみません。 http://www.tagindex.com/javascript/link/frame.html を見てみましたが、「// 設定開始（表示するフレーム名とリンク先URLを設定してください） 」にどのページのＵＲＬを書けばいいのか、Ａにあるクリックする文字のところにどうやって書けばいいのかわかりません。 よろしくお願いします。

  • ターゲットフレームについて教えてください。

    フロントページを使っています。元々上下に3分割されたフレームの真ん中部分に、さらに左右に2分割したフレームを入れたいのです。左部分をコンテンツにして、リンク先を右部分に表示したいのですが、ターゲットフレームを右部分のフレーム名にしてるのに、どうしてもリンク先を表示させると左部分が残らず、元々の上下のフレームしか残りません。教えてください、よろしくお願いします。

  • フレーム内のURLを表示させる方法

    2分割のページがあります。左にメニュー、右に本文という形です。左のメニューを開いていくと、右に次々にページが展開されますが、IEのアドレスバーに表示されているアドレスは変わってくれません。（フレーム構造でないと変わるんですよね！） フレーム構造のまま、入れ子になっているページのURLが表示されるようにしたいのですが、それは可能ですか？矛盾しているかもしれませんが・・・

    • ベストアンサー
    • HTML
  • プルダウンリンク先の指定フレームに関して

    現在フレームを5つに分割しています。 横2列、左の列に2行（上のframe：a、下の frame：b）、右の列に3行（c、d、f）と分割しています。 まず、"a"にプルダウンリンクがあり、指定先が"d"になります。 "d"に指定されたファイルにもプルダウンリンクがあり、"e"に表示しています。 2段階に選択をして3段階目にファイルを表示できるものです。 ここでやめればいいのですが… 利便性のため、別の項目も表示したいのです。 "b"にもプルダウンリンクを設置し、”d”には特定のファイルを、”f”にはvalueでしていたファイルをしていたいと思っています。 ただ本日一日中googleで検索をしていたのですが答えが出ませんでした。 いい回答があればと思います。 もう1つ… 別の方法で4つに分割をします。 横2列、左の列に2行（上のframe：a、下の frame：b）、右の列に2行（c、F） ”F”の指定ファイルを2分割（d、e）して上記ページと同じものを作成しました。 ただ、"ａ"のプルダウンから別のファイルの”e”を指定することは可能なのでしょうか？ これも解決できなかった内容です。 これができると非常に管理が楽なのですが… function navi(obj) { url = obj.options[obj.selectedIndex].value; if(url != "") { parent.frames["name"].location.href = url; } } と <select onChange="navi(this)"> <option value=""> </option> ： </select> でプルダウンの命令を出しています。

  • フレーム上部分を引っ張り込むリンク方法

    少し複雑なので文章で説明できるといいのですが・・・ まずTOPページがあります。 次にフレームで上下に分割したメニューページ「A」があります。 「A」の上部分はメニュー項目なので固定です。 下部分は「B」「C」と色々変わっていきます。 通常「A」→「B」にリンクする時は、ターゲットで指定してあげると ちゃんとフレームの上部分も付いてきますよね? 問題は、TOPページ→「B」にリンクしたときは、当然ながら上部分のフレームは外れてしまいます。 この場合の解決策は、すべての「B」「C」にフレームを付けるというので解決できますが、これが膨大な量なのです。 この場合、JAVAスクリプトでもなんでもかまいませんが、上部分のフレームを引っ張りこめる方法を教えて下さい。

  • フレームページにリンクをするとき、フレーム内のページを指定したい

    こんばんは。フレームページにリンクするとき、フレーム内のページのアドレスを指定する方法はありませんか？具体的には三分割で左フレームが上下に分かれていて、左上が検索ボックス、左下が検索結果、右が本文という形式のFAQですが、別リンクから特定のQ&Aページを右フレームに開かせたいのですが・・・。ご存知の方いらっしゃいましたら、ぜひご伝授願います。

  • ホームページのフレームのソースを教えてください

    以前　少し教えていただいたことがあるのですが 上手くいきませんでした。 たとえは　上から下に　２分割して　　経ダリのフレームにリンクができるように項目を2つぐらいつけようと思います この場合　HTMLのページは　　４つ　いるのですよね。 (1)　　左のページのみ（スクロールのソースをいれた）　　　　　　　　　　（リンク先2つのソースいれた） (2)　　右だけのページ　（右に表示されるHTMLのみ） (3)　　左のリンク先の１つ（A) 　　　　　　　　　　　　(1)の左のハイパーリンクを 　　　　　　　　　　　　押せば表示されるHTML (4)　　左のリンク先の残りの1つ　（ｂ） 　　　　　　　　　　　　(1)の左の残りのハイパーリン　　　　　　　　　　　　クを押せば表示されるHTML と理解しています それぞれに　HTMLを書き入れてみましたが　上手くいきません 詳しいことがきにゅうされたURLなど　紹介いただければ嬉しいのですが　　よろしく　お願いします また　仕組みについて　いまいち　理解がされていません　　教えてください

  • ビルダーのフレーム分割について

    こんにちは。 ビルダーでフレームを使ったページを作りたいのですが、よくわからないので教えてください。 左右２つに分割して、右がA、左がB1とします。 AからB1のページにリンクをはって、B1だけB2B3…と変えて行きたいのですが…やり方がわかりません。 ターゲットをかえればいいのでしょうか？その場合、どこにかえればいいんでしょう？ バージョンは6.0です。 よろしくお願いします。

    • 締切済み
    • CSS
  • フレームの表示と非表示の切り替え

    新しいWebページをフレームを使用して作成するのですが、表示切替で詰まっています。 フレームの構成は「まず上下に分割、その後下半分を3等分」という形なのですが、3等分された下半分(左からA、B、C)のうち、Cの表示・非表示を切り替える機能がほしいのです。具体的には「Cのリンク(ボタン)クリックでCが非表示になり、Bのリンク(ボタン)クリックで再度表示されるようにしたいのです。 どなたかご回答お願いします。

    • ベストアンサー
    • HTML

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する