ベストアンサー

【プルダウンメニュー】フレームの中のインラインフレームに、ターゲットを指定するには？

2006/05/23 23:42

現状は【フレームA（ヘッダー1）】【フレームB（ヘッダー2）】【フレームC（メイン）】【フレームD（フッター）】の4分割のうえに、更にフレームCの中に【インラインフレーム】があります。フレーム3の中にプルダウンメニューを設置し、インラインフレームに表示させたいのですが上手く動作しません。 ※ちなみに、「var target = "フレームA名";」で試してみると動作はするのですが…。という事は「フレームの中のインラインフレーム」という点がネックなのでしょうか？とあるソースを改良して使おうと思ったのですが、javascript素人につき行き詰まっています。どなたか回答いただけると嬉しいです。 <SCRIPT TYPE="text/javascript">  </SCRIPT> <FORM NAME="form1"> <SELECT NAME="select" onChange="jump()"> <option value="">お選びください <option value="Ahtml/arr">AAA <option value="B.html">BBB <option value="C.html">CCC <option value="D.html">DDD <option value="E.html">EEE </SELECT> </FORM>

roly
お礼率78% (11/14)

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

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

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

ベストアンサー

noname#22259

2006/05/24 14:32 回答No.3

- - arrival.html - - <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html><head><title>Untitled</title> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <script type="text/javascript"> function jump(){ var url=document.form1.select1.options[form1.select1.selectedIndex].value; if (url!="") document.arr.location.href = url; } </script> </head> <body> <iframe name="arr"></iframe> <FORM NAME="form1"> <SELECT NAME="select1" onChange="jump()"> <option value="">お選びください <option value="aaa.html">AAA <option value="bbb.html">BBB </SELECT> </FORM> </body> </html>

質問者

お礼 2006/05/24 16:44

無事に動作しました。ありがとうございました。長い間悩んでいたものが、こんなに早く解決できるとは…！感激です。素人同然の私の質問に、丹念に回答を頂きました事、心より感謝致します。

その他の回答 (2)

noname#22259

2006/05/24 09:17 回答No.2

- - arrival.html - - parent.arr.location.href = url;

質問者

補足 2006/05/24 13:38

【arrival.html】だけを表示し、動作確認をするときちんと動作するのですが、【index.html】で表示した状態（arrival.htmlがフレーム3「frame name="top"」に表示されている状態）で、動作確認をすると動きません。 ★現状のHPの構成は、下のyambejpさまへの補足説明を参考にして頂ければと思います。なお、今はこんな状況です。↓ <SCRIPT TYPE="text/javascript"> function jump(obj){ var url = obj.value; if (url!="") parent.frames["top"].document.getElementById('iframex').src=url; parent.arr.location.href = url; } <FORM NAME="form1"> <SELECT NAME="select" onChange="jump()"> <option value="">お選びください <option value="aaa.html">AAA <option value="bbb.html">BBB </SELECT> </FORM> 初心者につき、基本的な事も余りよく分かっておりません。ご指導願います。

yambejp
ベストアンサー率51% (3827/7415)

2006/05/24 00:27 回答No.1

こういうことですか？ //main.htm <frameset rows="10%,10%,*"> <frameset cols="50%,*"> <frame name="head1" src="1.htm"> <frame name="head2" src="2.htm"> </frameset> <frame name="body" src="3.htm"> <frame name="foot" src="4.htm"> </framset> //3.htm <SCRIPT TYPE="text/javascript"> function jump(obj){ var url = obj.value; if (url!="") parent.frames["foot"].document.getElementById('iframex').src=url; } </SCRIPT> <FORM NAME="form1"> <SELECT NAME="select" onChange="jump(this)"> <option value="">お選びください <option value="5.htm">5 <option value="6.htm">6 </SELECT> </FORM> //4.htm <iframe id="iframex" src="5.htm"></iframe>

質問者

補足 2006/05/24 01:04

アドバイスありがとうございます。ただ、当方が素人の所為か、上手く動作しません。現状がどういう状況になっているか、もう少し詳しく説明致しますので、再度アドバイスいただければ幸いです。【1】まずトップページが4フレームに分かれています。フレーム1（タイトル）左上フレーム2（メニュー）右上フレーム3（メインページ　frame nameは"top"）中央フレーム4（フッター）下メニューで選択すると、各内容がメインページに表示するに設定しています（targetをtopに指定しています）。【2】メニューで「新着情報」を選択すると、新着情報ページarrival.htmlがメインページに表示されます。【3】その新着情報ページarrival.htmlの中に、インラインフレーム「name=arr」があります。【4】今回はその新着情報ページarrival.htmlの中に、ポップアップメニューを設置し、その結果を同じくarrival.html内のインラインフレーム内に表示させたいのですが…！説明が下手ですみません。よろしくお願いします。

関連するQ&A

プルダウンメニューのターゲット指定
タイトルどおりなのですが、プルダウンメニューのリンク先を同ページ内のiframeにしたいのですがこれはどうすればできるのでしょうか？こちらに現在の状況を載せておきます。 <SCRIPT LANGUAGE="JavaScript"></SCRIPT> <FORM NAME="f"> <SELECT NAME="jumpto" onChange="Jump();">> <OPTION VALUE="-" SELECTED>移動先を選択</OPTION> <OPTION VALUE="menu1.htm" target="menu">Page1</OPTION> <OPTION VALUE="menu2.htm" target="menu">Page2</OPTION> </SELECT> </FORM> よろしくお願い致します。
- ベストアンサー
- JavaScript
相対パスが認識しない？
ビルダー１１を使用して作成しています。プルダウンメニューとインラインフレームを使用してレイアウトをしています。プルダウンメニューを選択するとインラインフレーム内が更新するように作成したいと思います。更新ボタンとかは無しで、選択されたらすぐに反映されるような形にしたいと思っています。色々調べて下記のように作成しました。 ------------------------------------------------------- <SCRIPT TYPE="text/javascript">  </SCRIPT> <FORM NAME="form1"> <SELECT NAME="select" onChange="jump()"> <OPTION VALUE="">選択してください <OPTION VALUE="a.html">その1 <OPTION VALUE="b.html">その２ </SELECT> </FORM> <IFRAME src="c.html" name="main">てすと</IFRAME> -------------------------------------------------- が、プルダウンを選択するとフレーム内がページがみつかりませんと表示されます。試しに、リンクの部分("a.html")を絶対パスにすると表示されました。この部分を相対パスにすることはできないのでしょうか？
- ベストアンサー
- ホームページ作成ソフト
セレクトメニューで
セレクトメニューでフレームを使った、複数のセレクトメニューで今の状態だと、上のセレクトメニューは問題ないのですが下のセレクトメニューで選択すると、上のセレクトメニューの「更新」になるだけになってしまいます。要所の所だけ、記載しますので間違ってるところを教えてください。 <script type="text/javascript">  </script> </head> <body> <TABLE border="0"> <TBODY> <TR> <TD><form action="#" name="form1"> <select name="select1" onChange="jump()"> <OPTION>　　メニュー</OPTION> </select> </form></TD> </TR> <TR> <TD><form action="#" name="form2"> <select name="select2" onChange="jump()"> <OPTION>　　メニュー</OPTION> </select> </form></TD>
- 締切済み
- JavaScript
プルダウンメニューからインラインフーム内を操作する
表題のようなものをjavascriptとフォームを使って用意しましたが、IE6、IE7の環境で試験しましたが問題ありませんでした。ところが、これをFirefoxで動かすと、プルダウンで選択してもインラインフレームはまったく変化しませんでした。どちらでも動作するようにしたいのですがどのように改変すればよろしいでしょうか。初心者でとんでもない間違いをしているかもしれませんが、どうかご教授ください。現在以下のような記述になっていますインラインフレーム名：inpage  <script type="text/"> function jump(){ var url=document.form1.select1.options[form1.select1.selectedIndex].value; if (url!="") document.inpage.location.href = url; } </script>   <FORM NAME="form1"> <SELECT NAME="select1" onChange="jump()"> <option value="">選択してください <option value="AAAAA.html">AAAAA <option value="BBBBB.html">BBBBB <option value="CCCCC.html">CCCCC </SELECT> </FORM> 
- 締切済み
- JavaScript
プルダウンメニュー
　以下のプログラムですが！仕様が二分割の縦分割フレームが特徴です。　左側フレームにリンクタグがあり、そのリンクタグをクリックすると、右フレームに HPが観れるようになっています。　しかし、プルダウンメニューのYahooをクリックしたらakkotyan.html、は左フレームになぜか出てきてしまって困っています。　それともう１つ、プルダウンメニューのhouyhnhnmsをクリックしても何もフレームに出てこなくて無反応です？　そのほか　　「クリックで動くプログラ」と「知恵袋竹島問題」はちゃんと右フレームに出てきて　問題ありません。　　プルダウンメニュータグのHPを右フレームに出すにはどうしたらできますか！？　宜しくお願いします。 -------------------------------------------------------- 左フレーム <html> <head> </head> <frameset cols="26%,*"> <frame src="left.html"name="menu"> <frame src="pronagare.html"name="contents"> </frameset> <html> ------------------------------------------------------- 右フレーム <html> <HTMl> <HEAD> <TITLE>プルダウンメニューのHPを右フレームへ表示したい</title> <script>addEventListener('load',function(ev){ document.forms['jump'].elements['to'].addEventListener('change',function(ew){ var map = { yahoo: './akkotyan.html', houyhnhnms: 'http://google.com/search?tbm=isch&q=houyhnhnms' }; var url = map[ew.target.value]; if (url) window.location = url; },false); },false)</script> <body> <form name=jump><select name=to> <option value='' selected>-</option> <option value=yahoo>Yahoo</option> <option value=houyhnhnms>Houyhnhnms</option> </form> </select> <P> <a href="pronagare.html"target="contents">クリックで動くプログラム</a><br> <a href="takesima.html"target="contents">知恵袋竹島問題</a><br> </body> </html>
- ベストアンサー
- JavaScript
フレームを使ったプルダウンメニュー
フレームで「ヘッダー・左メニュー・右メインページ」というように３分割にし、左メニューに置いたプルダウンから項目を選ぶと右メインに表示される、という構造にしたいと思っています。 <HEAD>～</HEAD>内↓ <script language="JavaScript"> function jump(form) { var myindex=form.destination.selectedIndex window.open(form.destination.options[myindex].value, target="main"); } //--> </SCRIPT> プルダウン部分↓ <FORM NAME="form"> <SELECT NAME="destination"> <OPTION VALUE="a.html" SELECTED>あ</OPTION> <OPTION VALUE="k.html">か</OPTION> <OPTION VALUE="s.html">さ</OPTION> <OPTION VALUE="t.html">た</OPTION> <OPTION VALUE="n.html">な</OPTION> </SELECT> <INPUT TYPE="image" SRC="go.gif" onClick="jump(this.form)" BORDER="0"> </FORM> という様に記述した所、例えばプルダウンで「た」を選択した場合、右フレームにちゃんとt.htmlが表示されるのですが、左フレームのプルダウンの項目が「あ」に戻ってしまいます。「た」を選択した状態のまま残したいのですが。ちなみにボタンに画像を使わず、<INPUT TYPE="button" ・・・・>にするとなぜか「た」選択の状態でちゃんと残ります。でも、できれば画像を使いたいのです。うまいやり方をご存じの方は、教えていただけますか。おねがいします。
- ベストアンサー
- JavaScript
セレクトメニューでリンクの際、targetの指定の方法
2つのフレーム（上下）で分けたページで、上(top)・下（bottom）というフレーム名にしています。上（top）にセレクトメニューを設置しリンクをはって、下（bottom）にhtmlを表示したいのですが、target="bottom"というのは、どこに入れたらいいのか。。。いろいろやってみたのですが、全く分かりません。お分かりになる方、どうぞ教えて下さい。よろしくお願いいたします。 <SCRIPT type="text/JavaScript">  </SCRIPT> <FORM><SELECT onChange="moveUrl(this)"> <OPTION value="" selected">メニュー選択 </OPTION> <OPTION value="main1.html">概要 </OPTION> <OPTION value="main2.html">仕組み </OPTION>
- ベストアンサー
- JavaScript
プルダウンメニューのターゲット指定について
はじめまして。ドリームウィーバー８を使用しております。インラインフレーム内にプルダウンメニューを設置したいのですが <select onChange="DD_List_Link(this)"> <option value="#">メニュー</option> <option value="URL" target="_top">A</option> <option value="URL" target="_top">B</option> <option value="URL" target="_top">C</option> ・・・このタグではターゲット指定が反映されません。初心者で、的外れな質問かもしれませんが、回答頂ければ幸いです。宜しくお願い致しますｍ(＿)ｍ初心者で
- ベストアンサー
- HTML
プルダウンのメニューを表示を2つ設定。
プルダウンのメニューを表示を2つ設定したいのですが、どこが間違っているのでしょうか。基本的にjsは、セレクタ名がかぶっていれば、機能しなくなります。間違いをご指摘ください。 <!DOCTYPE html> <html> <head> <title></title> <script language="javascript" type="text/javascript"> function selectboxChange() { var val1 = document.forms.form1.Select1.value; var target = document.getElementById("output"); if (val1 == "要素1") { target.innerHTML = "合っています。"; } else { target.innerHTML = "間違っています。"; } } </script> </head> <body> <form name="form1" action=""> <select id="Select1" onchange="selectboxChange();"> <option>---</option> <option value1 == "要素1">要素1</option> <option>要素2</option> <option>要素3</option> <option>要素4</option> <option>要素5</option> </select> </form> <div id="output"></div> </body> </body> <script language="javascript" type="text/javascript"> function selectboxChange11() { var val11 = document.forms.form11.Select11.value; var target = document.getElementById("output11"); if (val11 == "要素11") { target.innerHTML = "合っています。"; } else { target.innerHTML = "間違っています。"; } } </script> </head> <body> <form name="form11" action=""> <select id="Select11" onchange="selectboxChange11();"> <option>---</option> <option value11 == "要素11">要素1</option> <option>要素2</option> <option>要素3</option> <option>要素4</option> <option>要素5</option> </select> </form> <div id="output11"></div> </body> </body> </html>
- ベストアンサー
- JavaScript
複数のプルダウンメニューから指定フレームへ表示
質問内容を検索してhttp://omedeta.okweb.jp/kotaeru.php3?q=1205107 から抜粋させていただきました。 funfun31様、ご回答された方々、まこと申し訳ございません。ありがとうございます。現状、上部(固定)、左フレーム(プルダウン設置)、右フレーム上（表のサンプル表示）、右フレーム下（メインページ）というページの構成でfunfun31様とほとんど同じです。上フレーム（完成）左フレーム（↓のJavaScriptを設置）右フレーム上（右フレーム下へ表示する表の見方）右フレーム下（ここにプルダウンメニューで選択した内容表示）左フレームの内容 <HTML> <HEAD> <script kanguage=Javascript"> <!-- function myGo(myPullDown) { 　　var mySelect = myPullDown.selectedIndex; 　　parent.右フレーム下ファイル名.location.href = myPullDown.options[mySelect].value; </script> <body background="壁紙"> <form name="myForm"> 題名１<br> <select name="myMenu1" onChange="myGo(this)"> <option selected>選択 <option value="01.htm">01 <option value="02.htm">02 <option value="03.htm">03 </select> <br> 題名２<br> <select name="myMenu2" onChange="myGo(this)"> <option selected>選択 <option value="04.htm">04 <option value="05.htm">05 <option value="06.htm">06 </select> </form> </body> </html> どこが間違っているのかがわかりません。現状選択しても右フレーム下に反応がありません。知識不足で単純な見落とし、または根本的な間違いがあるかも知れません。無知でまこと申し訳ございませんが是非ご回答よろしくお願いいたします。
- ベストアンサー
- JavaScript

【プルダウンメニュー】フレームの中のインラインフレームに、ターゲットを指定するには？