こんにちは。
よくある質問もみたのですが「複数のプルダウンメニュー」「フレームを使ったプルダウン」というのはあるのですが、
フレームを使用して左フレームに複数プルダウン、そこで選んだものを右フレームに表示させるというのが見つかりませんでした。
「複数のプルダウンメニュー」もつくれますし、「別フレームに表示させる」こともできるのですが、
プルダウンを増やしたとたんに動きません。
ネームを変えてもみたのですがうまくいきません。
フレームを二つつくって
<FRAMESET cols="35%,65%">
<FRAME src="n_menu.htm" name="manu">←こっちにプルダウンメニュー
<FRAME src="n_main.htm"name="main">←こっちに表示
目次のhtmファイルで
<SCRIPT LANGUAGE="JavaScript">
function openPage() {
var list = document.forms[0].urlList;
parent.frames[1].location = list.options[list.selectedIndex].value;
}
</SCRIPT>
</HEAD>
<FORM>
<SELECT NAME="urlList" onChange="openPage()">
<OPTION SELECTED VALUE="cover1.htm">朝の歌
<OPTION VALUE="1.htm">1番目のページ
<OPTION VALUE="2.htm">2番目のページ
<OPTION VALUE="3.htm">3番目のページ
</SELECT>
</FORM>
#上記をコピペして増やしてみた↓
<FORM>
<SELECT NAME="urlList2" onChange="openPage()">
<OPTION SELECTED VALUE="cover2.htm">夜の歌
<OPTION VALUE="4.htm">4番目のページ
<OPTION VALUE="5.htm">5番目のページ
<OPTION VALUE="6.htm">6番目のページ
</SELECT>
</FORM>
これだと2本目が表示されません。
どうすればいいか教えていただけないでしょうか?
No.1ベストアンサー
- 回答日時:
こんな感じですね。
最初のソースだと、form[0]というフォームが固定されているので
できません。
<SCRIPT LANGUAGE="JavaScript">
function openPage(list) {
parent.frames[1].location.href = list.value;
}
</SCRIPT>
</HEAD>
<FORM>
<SELECT NAME="urlList" onChange="openPage(this)">
<OPTION SELECTED VALUE="cover1.htm">朝の歌
<OPTION VALUE="1.htm">1番目のページ
<OPTION VALUE="2.htm">2番目のページ
<OPTION VALUE="3.htm">3番目のページ
</SELECT>
</FORM>
#上記をコピペして増やしてみた↓
<FORM>
<SELECT NAME="urlList2" onChange="openPage(this)">
<OPTION SELECTED VALUE="cover2.htm">夜の歌
<OPTION VALUE="4.htm">4番目のページ
<OPTION VALUE="5.htm">5番目のページ
<OPTION VALUE="6.htm">6番目のページ
</SELECT>
</FORM>
早い回答をありがとうございました!
()の中に渡すというのは講座で見たのですが、
その下の処理をどうすればいいのかわからなくていじり回してました。
これで新しいコンテンツが立ち上げられます。
本当にありがとうございました!!!!
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- JavaScript JavascriptからSQLへ繋ぎ方が分からない 3 2022/07/07 00:27
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
- JavaScript console.logがどうしても2つ機能しないのでアドバイスをくださいお願いします 2 2022/07/07 22:13
- JavaScript セレクトボックスを2つ選択してメッセージなどを表示するには。~運賃検索プログラムを完成させたい~ 1 2022/07/22 11:10
- JavaScript セレクトを全て選択されていないと、文字によるエラーメッセージを表示させるコードを調べています 2 2023/06/22 15:48
- JavaScript 電車の運賃を出すプログラムを作っています。 2 2022/06/22 09:36
- JavaScript sessionStorageを調べています。 1 2023/06/20 12:41
- JavaScript switch文のswitch(n)の部分を複数の値にするか、if文に変えてほしいです。 1 2022/07/27 17:18
- JavaScript 2段階プルダウンで1段階目の選択を終えた後に選択ボックスを見えなくしたい 2 2022/07/05 21:58
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
HTMLでサブフレームから親のス...
-
フレーム分割について
-
1回のクリックで複数のフレーム...
-
別フレームのページが読み込み...
-
子フレームの自動リロードは可...
-
親フレームからkeydownイベント...
-
外部から読み込まれたJava...
-
インフレーム内ページを記憶したい
-
フレーム リロード
-
<a href="#" …>の意味を教えて...
-
あなたのXAMPPのdashboard内のj...
-
乱数を一定時間毎に表示させた...
-
相対パスと絶対パスの速度
-
html メールリンクにて自動ファ...
-
プルダウンメニューを別ファイ...
-
Dreamweaver で 外部JSを読み込...
-
JavaScript で指定した月日に別...
-
フレームサイズの変更について
-
metaタグのrefresh機能について
-
javascript スライダー
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
HTMLでサブフレームから親のス...
-
スマホ上で、左右スワイプで次...
-
インラインフレームをドラッグ...
-
フレームを跨ぐドロップダウン...
-
インラインフレームで表示され...
-
別ページのインラインフレーム...
-
子フレームの自動リロードは可...
-
外部から読み込まれたJava...
-
openerは使えないのでしょうか?
-
他のフレームのスクリプトを実...
-
親フレームからkeydownイベント...
-
Safariで<iframe>のinnerHTMLを...
-
フレーム分割領域のサイズを変...
-
フレームを使用した複数プルダ...
-
ページ遷移をコントロールしたい
-
jqueryを利用してインラインフ...
-
エラー:書き込みができません ...
-
親ウィンドウの別フレームを子...
-
フレームでの右クリック禁止
-
フレーム内のiframeのデータの...
おすすめ情報