インラインフレーと複数プルダウンメニューのリンク方法
- インラインフレームと複数のプルダウンメニューを連携させる方法についての質問です。
- 現在のスクリプトにはプルダウンメニューとインラインフレームの連携がなく、どこにターゲットを指定すれば良いか分からないとのことです。
- 質問者は自分で試行錯誤しているが、解決には至っていないため、助言を求めている。
- ベストアンサー
インラインフレーと複数プルダウンメニューのリンク方法
はじめまして。他のインラインフレームとプルダウンメニューの質問と 回答も見たのですが、自分のスクリプトと状況とは異なるようで問題の 解決には至っていません。 どなたかご教示頂けますでしょうか。宜しくお願い致します。 質問：３つのプルダウンメニュー（フォームは３つ作成）をひとつの iframe に表示する際のスクリプトの書き方とターゲットの指定方法を 教えてください。 現在のスクリプトは下記の通りです。 <HEAD> <SCRIPT LANGUAGE="JavaScript"> <!-- function menuLink(linkLoc) { if(linkLoc !="") { window.location.href=linkLoc;} } //--> </SCRIPT> </HEAD> <IFRAME src="impressum.html" align="middle" scrolling="AUTO" frameborder="0" name="iframe1" width="785" height="400"></IFRAME> <FORM> メニュー1<SELECT onchange="menuLink(this.options[this.selectedIndex].value)" style=': font-size : 13px;font-family : Verdana,"ＭＳ Ｐゴシック";line-height : 18px;width : 200px;position : fixed;'> <OPTION SELECTED>選択してください</OPTION> <OPTION VALUE="index.html">Home</OPTION> <OPTION VALUE="new.html">What's New</OPTION> <OPTION VALUE="gallery.html">Gallery</OPTION> <OPTION VALUE="diary.html">Diary</OPTION> <OPTION VALUE="map.html">Map</OPTION> <OPTION VALUE="profile.html">Profile</OPTION> </SELECT> </FORM <FORM> メニュー2<SELECT onchange="menuLink(this.options[this.selectedIndex].value)" style=': font-size : 13px;font-family : Verdana,"ＭＳ Ｐゴシック";line-height : 18px;width : 200px;position : fixed;'> <OPTION SELECTED>選択してください</OPTION> <OPTION VALUE="index.html">Home</OPTION> <OPTION VALUE="new.html">What's New</OPTION> <OPTION VALUE="gallery.html">Gallery</OPTION> <OPTION VALUE="diary.html">Diary</OPTION> <OPTION VALUE="map.html">Map</OPTION> <OPTION VALUE="profile.html">Profile</OPTION> </SELECT> </FORM> <FORM> メニュー3<SELECT onchange="menuLink(this.options[this.selectedIndex].value)" style=': font-size : 13px;font-family : Verdana,"ＭＳ Ｐゴシック";line-height : 18px;width : 200px;position : fixed;'> <OPTION SELECTED>選択してください</OPTION> <OPTION VALUE="index.html">Home</OPTION> <OPTION VALUE="new.html">What's New</OPTION> <OPTION VALUE="gallery.html">Gallery</OPTION> <OPTION VALUE="diary.html">Diary</OPTION> <OPTION VALUE="map.html">Map</OPTION> <OPTION VALUE="profile.html">Profile</OPTION> </SELECT> </FORM> 見てお分かりの通り、プルダウンメニューとiframeへのつながりが ありません。。。どこにiframeへのターゲットを指定すれば良いかなど が分かりません。自分でも色々試しては見ましたがどんどん分からなく なってきてしまいました。宜しくお願い致します。
- odagiri_32
- お礼率100% (9/9)
- JavaScript
- 回答数2
- ありがとう数6
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
こんにちは window.location.href=linkLoc; ではなく iframe1.location.href = linkLoc; になります
その他の回答 (1)
- leap_day
- ベストアンサー率60% (338/561)
こんにちは メニュー3だけ別のfunctionを呼び出してやればいいですよ メニュー3<SELECT onchange="Link(this.options[this.selectedIndex].value)"> function Link(linkLoc) { if(linkLoc !="") { window.location.href=linkLoc;} } 新窓・・・というのは別窓のこと？ function Link(linkLoc) { if(linkLoc !="") { window.open(linkLoc,""); } } ※サイズ指定とかもできるけど省略してます『window.open』などで検索してみてください
お礼
有難うございました！ これから試すのでまだ成功はしていませんがご教示頂いたとおりにいじって見ます。自分でも調べながらなんとか動作するように頑張ってみます！！
補足
早速試したところ出来ました！ 各プルダウンメニューを一つのiframe にリンクさせる方法と、メニュー3のみを別窓に表示させる方法共に成功しました。 本当に有難うございました！ 今回教えて頂きますます自分でも勉強しなくては、と実感しました。 疑問は解決したので質問は締め切らせて頂こうと思います。
関連するQ&A
- プルダウンメニューの選択時のリンク先について
「プルダウンメニューから選択すると、別ページにリンク」するページを 作成したいです。 以下の様に途中まではできたのですが、 「フレームを使わず、同じウインドウの別の箇所にリンク先を表示 ※プルダウンメニューはそのまま表示」 がどうしてもできません。xmlで作成している関係上、phpも使えません。 何か方法はありませんでしょうか。 <SCRIPT LANGUAGE="JavaScript"> <!-- function menuLink(linkLoc) { if(linkLoc !="") {window.aaa.location.href=linkLoc;} } //--> </SCRIPT> <form> <SELECT onChange="menuLink(this.options[this.selectedIndex].value)"> <OPTION SELECTED>Select</OPTION> <OPTION value="">××</OPTION> <OPTION value="">●●</OPTION> </SELECT> </form>
- ベストアンサー
- ホームページ作成ソフト
- 複数のプルダウンメニューの作り方。
・Aリスト、Bリスト…とプルダウンメニューを複数含んだフォームを一つのhtmlに作りたいのですが、上手くいきません。 一つのフォームに一つのプルダウンメニューは上手くいくのですが、Javascriptを二つ並べると動かなくなります。 とりあえず関数名を重複しない様にしたらいいという事だけはネットで調べてわかりました。 今は、下記の状態になっています。 <script language="JavaScript"> <!-- function MENU(){ mySelect = document.myForm.myMenu.selectedIndex; location.href = document.myForm.myMenu.options[mySelect].value; } // --> </script> <form name="myForm"> <select name="myMenu" onChange="MENU()"> <option value="">A</option> <option value="a001.html">A001</option> <option value="a002.html">A002</option> <option value="a003.html">A003</option> </select> <select name="myMenu2" onChange="MENU()"> <option value="">B</option> <option value="b001.html">B001</option> <option value="b002.html">B002</option> <option value="b003.html">B003</option> </select> </form> ご指南の程宜しくお願いします。
- ベストアンサー
- JavaScript
- <form>タグのプルダウンメニューでのカラー設定
<form>タグでプルダウンメニューを作ったのですが、メニューの右になる▼の色設定や、メニュー枠の色設定、枠線サイズ設定などをするやる方法はありますでしょうか。 現在のソースはスタイルシートで .form_block { display: block; width: 75px; color: #000000; background-color: #008000; border: outset 1px #005000; margin: 0px; padding: 0px 0px 0px 0px; font-size: 11px; line-height: 15px; text-align: center; text-decoration: none; } htmlソースで <FORM class="form_block"> <SELECT onChange="menuLink(this.options[this.selectedIndex].value)" class="form_block"> <OPTION SELECTED class="form_block">項目</OPTION> <OPTION VALUE="select1.htm" class="form_block">選択肢１</OPTION> <OPTION VALUE="select2.htm" class="form_block">選択肢２</OPTION> </SELECT> </FORM> と記述してますが、うまくいきません。 詳しい方、よろしくお願い致します。
- ベストアンサー
- HTML
- ドロップダウンメニューによるアイフレームへのリンク
現在Webサイトを作っています。 ですがドロップダウンメニューからリンクをし、リンク先をアイフレームにするのがうまくいきません。 問題のページのHTML、及びJavaScriptは以下の通りです。 <html> <head> <script type="text/javascript"> <!-- function Mylink(form,sel){ mlink=sel.options[sel.selectedIndex].value; if(mlink!="-"){parent.albumf.location.href=mlink;} } //--> </script> </head> <body> <center> <IFRAME name="albumf" frameborder=0 src="●●.html" scrolling=no allowtransparency=true></IFRAME> <BR> <BR> <FORM method="post"> <select onChange="Mylink(this.form,this)"> <OPTION selected value="-"> ＊ メニュー ＊</OPTION> <OPTION value="-">------------------------</OPTION> <OPTION value="●●.html">項目１</OPTION> <OPTION value="▲▲.html">項目２</OPTION> <OPTION value="-">------------------------</OPTION> </select> </FORM> </center> </body> </html> JavaScriptに関する様々なページを調べましたが、どうしても自力で解決できませんでした。 どなたか改善方法を教えて下さい。 よろしくお願いします。
- ベストアンサー
- JavaScript
- ホームページでJavascriptを使ったプルダウンメニューによる画面切替え
ホームページでiframe内のページをプルダウンメニューを変更したいのですが、アンカーポイントでのプルダウンメニューのリンクではホームページを代える事は出来ないのですか？ プルダウンメニューを行うとJavascriptエラーが起きて画面がリンク先になりません。 ○Javascriptの文 <SCRIPT language=JavaScript type=text/JavaScript> <!-- function MM_jumpMenu(targ,selObj,restore){ //v3.0 eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'"); if (restore) selObj.selectedIndex=0; } //--> </SCRIPT> ○iframeの文 <iframe src="report.html" name=if width="440" height="500" frameborder="0">iframeを使用しております。<br></iframe> ○プルダウンメニューの文 <FORM name=form1> <SELECT onchange="MM_jumpMenu('parent.frames[\'if\']',this,0)" name=menu1> <option value="report.html\#0008" selected>第８回目</option> <option value="report.html\#0007">第７回目</option> <option value="report.html#0006">第６回目</option> <option value="report.html#0005">第５回目</option> <option value="report.html#0004">第４回目</option> <option value="report.html#0003">第３回目</option> <option value="report.html#0002">第２回目</option> <option value="report.html#0001">第１回目</option> </select> </form> どこが悪いのか教えてください。分かる方いらっしゃいますか？ 教えてください、お願いいたします。
- 締切済み
- JavaScript
- プルダウンメニューが文字化けする
タイトル通りプルダウンメニューが文字化けしてしまいます。javaを使ってホームページに表示させています <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <!--メニュー↓--> <script language="javascript"> <!-- function navi(obj) { url = obj.options[obj.selectedIndex].value; if(url != "") { location.href = url; } } //--> </script> <form method=post> <select name="navi"> <option value=""> --メニュー -- <option value="http://">TOPページ <option value="http://">特別企画 <option value="http://">ご挨拶 <option value="http://">ご協力 <option value="http://">PC版 <option value="http://">ブログ </select> <input type=button value="ジャンプ" onClick="location.href = this.form.navi.options[this.form.navi.selectedIndex].value"> </form> <!--メニュー↑-->
- ベストアンサー
- その他（インターネット・Webサービス）
- 複数のプルダウンメニューの組み合わから外部リンクを作りたい・・・
複数のプルダウンメニューからそれぞれ組み合わから外部リンクを作りたいのですが、できません。 過去に、こちらで質問されている方がいましたが http://oshiete1.goo.ne.jp/qa3418973.html 回答されている方の様作成したらプルダウンが２個なら上手く動作しました。 やりたいことは、全く上記の方の質問内容と 同じです。 今回、４個のプルダウンメニューで作成したいのですが 上手くいきません・・・ 上記の質問にご回答されていた方のものを 参考にサンプルで作成してみたのですが 動作しません・・・ それと、各プルダウンメニュー内で表示させたい項目が１２あるのですが簡潔にjavascriptの記述ができますでしょうか？ arr[0][0][0]= "http://www.link_0_1.com";・・・・ 以下の行数がとても長くなってしまうので 簡潔にしたいのですが、できますでしょうか？ こちら、javascriptは初心者です。 どうぞ、宜しくお願いします。 ----------------------------------------------------------- <html> <head> <script Language="JavaScript"> <!-- /*** 変数 ***/ // カラー (color) とサイズ (size) インチ(inch）の初期値 var color = 0; var size = 0; var inch = 0; // 二次元配列を定義する。 var arr = new Array(); arr[0] = new Array(); arr[1] = new Array(); arr[2] = new Array(); // arr[色][サイズ][インチ] という指定でリンクする URL が決定する。 arr[0][0][0]= "http://www.link_0_1.com"; arr[0][1][0]= "http://www.link_0_1.com"; arr[0][2][0] = "http://www.link_0_1.com"; arr[1][0][0] = "http://www.link_0_1.com"; arr[1][1][0] = "http://www.link_0_1.com"; arr[1][2][0] = "http://www.link_0_1.com"; arr[2][0][0] = "http://www.link_0_1.com"; arr[2][1][0] = "http://www.link_0_1.com"; arr[2][2][0] = "http://www.link_0_1.com"; arr[0][1][0] = "http://www.link_0_1.com"; （以下省略） /*** 関数 ***/ function set_color(selected_option) { color = selected_option.selectedIndex; print_link_url(); } function set_size(selected_option) { size = selected_option.selectedIndex; print_link_url(); } function set_inch(selected_option) { inch = selected_option.selectedIndex; print_link_url(); } function print_link_url() { document.form1.link_url.value = arr[color][size][inch]; } function jump() { location.href = arr[color][size][inch]; } // --> </script> </head> <body> <form name="form1" method="GET"> カラー: <select onChange="set_color(this)"> <option value="赤">赤</option> <option value="青">青</option> <option value="黄">黄</option> </select> サイズ: <select onChange="set_size(this)"> <option value="Ｌ">Ｌ</option> <option value="Ｍ">Ｍ</option> <option value="Ｓ">Ｓ</option> </select> サイズ: <select onChange="set_inch(this)"> <option value="11">11</option> <option value="12">12</option> <option value="13">13</option> </select> <br> <input type="button" value="検索" onClick="jump()"> <br> </form> </body> </html>
- ベストアンサー
- JavaScript
- プルダウンメニューのターゲット指定
タイトルどおりなのですが、プルダウンメニュー のリンク先を同ページ内のiframeにしたいのですが これはどうすればできるのでしょうか？ こちらに現在の状況を載せておきます。 <SCRIPT LANGUAGE="JavaScript"><!-- function Jump() { tu = document.f.elements['jumpto'].options[document.f.elements['jumpto'].selectedIndex].value if( tu != '-' ) { location.href = tu; } else { alert('移動先を選択して下さい。'); } } // --></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
- プルダウンメニュー
こんばんは。 日時をプルダウンメニューで選択するのですが、 月が変わると、内容も変わるようにしたいと思っています。JavaScriptで、出来ると聞いたのですが、 やり方が解りません。 このように書いてみたのですが、 画面には何も表示されません。 助けてください。 <SCRIPT LANGUAGE = "JavaScript"> <FORM NAME="form1" METHOD="post"> if (mm = 2){ document.write("<SELECT NAME="dd1" onChange="document.form1.dd.value=dd1.options[d d1.selectedIndex].value"> <OPTION VALUE="00"> <OPTION VALUE="16">16 <OPTION VALUE="17">17 <OPTION VALUE="18">18 <OPTION VALUE="19">19 <OPTION VALUE="20">20 <OPTION VALUE="21">21 <OPTION VALUE="22">22 <OPTION VALUE="23">23 <OPTION VALUE="24">24 <OPTION VALUE="25">25 <OPTION VALUE="26">26 <OPTION VALUE="27">27 <OPTION VALUE="28">28 </SELECT>日"); } if ((mm = 4) || (mm = 6) || (mm = 9) || (mm = 11)){ document.write("<SELECT NAME="dd1" onChange="document.form1.dd.value=dd1.options[d d1.selectedIndex].value"> <OPTION VALUE="00"> <OPTION VALUE="16">16 <OPTION VALUE="17">17 <OPTION VALUE="18">18 <OPTION VALUE="19">19 <OPTION VALUE="20">20 <OPTION VALUE="21">21 <OPTION VALUE="22">22 <OPTION VALUE="23">23 <OPTION VALUE="24">24 <OPTION VALUE="25">25 <OPTION VALUE="26">26 <OPTION VALUE="27">27 <OPTION VALUE="28">28 <OPTION VALUE="29">29 <OPTION VALUE="30">30 </SELECT>日"); } else{入らないので省きます。 </FORM> </SCRIPT>
- 締切済み
- JavaScript
- プルダウンメニューからのリンクの貼り方
ＦＯＲＭのプルダウンメニューからリンクをはっていますが、新しいページを開くのはどうしたら良いでしょう？ 今は <select name="menu" size="1" onchange="location=this.options[this.selectedIndex].value"> と書いていて、同じページ内で別ページに移動します。 またプルダウンメニューからのリンクで、ページサイズを指定したり、スクロールバー、ツールバーの表示も指定したいのですが出来るのでしょうか？ ご存知なかたはよろしくお願いします。
- ベストアンサー
- JavaScript
お礼
早速のご回答有難うございました！ 教えて頂いたとおりに書き直したら動作するようになりました！ 本当に有難うございました。今夜はすっきり眠れそうです。
補足
すみません。応用編で「メニュー3」のプルダウンメニューのみを新窓で開きたい場合のスクリプト記述方法をご教示頂けますでしょうか。 申し訳ありませんが宜しくお願い致します。