締切済み

プルダウンのoptionの表示・非表示はできますか？

2007/02/28 22:11

JavaScriptを使ってプルダウン操作をしております。一つ目のプルダウンで選択したあと2つ目のプルダウンのoptionの部分だけ表示・非表示をしたいのです。そんなことはできるのでしょうか？下のソースで説明しますが、一つ目のリストで「あいうえお」を選択した時点で2つ目の選択リストの「ひらがな1」と「ひらがな2」だけを選択できるようにしたいのです。「カタカナ1」「カタカナ2」は非表示もしくは選択不可にできればいいのですが。一つ目のプルダウンリスト <select name="formtype" onchange="form_indicate();"> <option value="AAA">あいうえお <option value="BBB">アイウエオ </select> 二つ目のプルダウンリスト <select name="formtype2"> <option value="aaa">ひらがな1 <option value="bbb">ひらがな2 <option value="ccc">カタカナ1 <option value="ddd">カタカナ2 </select>

bakusui
お礼率54% (169/308)

JavaScript
回答数2
ありがとう数0

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

みんなの回答

leap_day
ベストアンサー率60% (338/561)

2007/03/01 06:03 回答No.2

こんにちはこんな感じでどうですか？ <script language="JavaScript"></script> </head> <body> <form name="form" action="./test.cgi"> <select name="formtype" onChange="setMenu(this.selectedIndex)"> <option value="">選択すれば次のセレクトが出ます</option> <option value="AAA">あいうえお</option> <option value="BBB">アイウエオ</option> </select> <select name="formtype2" style="visibility:hidden"> <option value=""></option> </select> <input type="submit" value="送信" name="submit" style="visibility:hidden"> </form>

ANASTASIAK
ベストアンサー率19% (658/3306)

2007/02/28 22:47 回答No.1

このようなときは、２つ目を <select name="formtype2a"> <option value="aaa">ひらがな1 <option value="bbb">ひらがな2 </select> <select name="formtype2b"> <option value="ccc">カタカナ1 <option value="ddd">カタカナ2 </select> のように２つに分けて、それぞれをstyleのdisplayでON/OFF にします。

質問者

補足 2007/02/28 23:20

早速の返信ありがとうございます。 optionのdisplayはできないのでしょうか？確かに、おっしゃるその方法は試してOKではあったのですが、問題が発生しました。実はCGIでプログラムを組んでいるのですが、本来のソースは以下のようになっています。 <select name="formtype" onchange="form_indicate();"> <option value="AAA" selected>あいうえお <option value="BBB">アイウエオ </select> 二つ目のプルダウンリスト <select name="formtype2a"> <option value="aaa">ひらがな1 <option value="bbb">ひらがな2 </select> 三つ目のプルダウンリスト <select name="formtype2b"> <option value="ccc">カタカナ1 <option value="ddd">カタカナ2 </select> このようにソースを書いているのですが一つ目のプルダウンを「アイウエオ」に変更するとdisplayで3つ目のプルダウンが表示はされるのですがvalueが送られないのです。 CGIが悪いのかもしれませんが、とりあえずJavaScriptでoptionを非表示にできたらなあと思いまして・・・

関連するQ&A

プルダウン選択によるボタンの表示／非表示に関して
教えて下さい。下のように、ONCHANGEイベントで、プルダウンにて選択された内容を、別のテキスト（'text'）エリアに表示させる記述をしましたが、今度は選択された内容によって、ボタンの表示／非表示をコントロールしたいと考えています。実際には、下の記述で、'BBB'が選択された場合のみ、***よりしたの"日"ボタンを表示させたいと考えています。どのように記述すれば良いでしょうか。。。教えて頂きたいと思います。 <SCRIPT LANGUAGE="JavaScript"> function ChangeSelection(form, selection,num) { v = selection.value; form.text.value = v; } <FORM NAME="fm_a" print("<TD><input name='text'></input>\n"); print("</TD>\n"); print("<TD><select name='am_note' ONCHANGE='ChangeSelection(this.form, this)'>\n"); print("<option value=''></option>\n"); print("<option value='AAA'>AAA</option>\n"); print("<option value='BBB'>BBB</option>\n"); print("<option value='CCC'>CCC</option>\n"); print("</select>\n"); print("</TD>\n"); ************************************************************** print("<TD>\n"); print("<input name='Cal' type='button' value='日'\n"); print("</TD>\n");
- ベストアンサー
- JavaScript
selectタグの項目を制御する
フォーム内のプルダウンの項目を制御する方法がわからなくて困っています。 form1というフォーム内にプルダウンが3つあります。 <select name="select_1"> <option value="AAA">AAA</option> <option value="BBB">BBB</option> <option value="CCC">CCC</option> </select><br/> <select name="select_2"> <option value="AAA_1">AAA_1</option> <option value="AAA_2">AAA_2</option> <option value="BBB_1">BBB_1</option> <option value="CCC_1">CCC_1</option> </select><br/> <select name="select_3"> <option value="AC">AC</option> <option value="AB">AB</option> <option value="B_1">B_1</option> <option value="B_2">B_2</option> <option value="B_3">B_3</option> </select><br/> ●まず、select_1がAAAなら、select_2でAAA_1とAAA_2のみ選択できるようし、select_2で、AAA_1が選択されたらselect_3にACをAAA_2が選択されたらABを表示。 ●select_1でBBBが選択されたら、select_2にBBB_1のみを表示し、変更不可にする。そして、select_3にABC,B_1,B_2,B_3を表示。 ●select_3でCCCが選択されたら、select_2にCCC_1のみを表示して変更不可にし、select_3にACのみを表示して変更不可にする。こんな感じにしたいのですが、どうもうまく出来ません。考えたのは、各selectタグにonchange=change_1(form1)として、関数を呼び出し、 no= form1.select_1.selectedIndex; noが0なら thisForm.select_2.length = 2; //オブジェクトを2にする thisForm.select_2.options[0].value = "AAA_1"; の様にしたのですが、はじめに表示したoptionを消したりする方法や変更不可にする方法ってあるんでしょうか？また、ほかの方法など、どなたかわかる方がいましたら、よろしくお願いいたします。
- ベストアンサー
- JavaScript
複数のプルダウンメニューの作り方。
・Aリスト、Bリスト…とプルダウンメニューを複数含んだフォームを一つのhtmlに作りたいのですが、上手くいきません。一つのフォームに一つのプルダウンメニューは上手くいくのですが、Javascriptを二つ並べると動かなくなります。とりあえず関数名を重複しない様にしたらいいという事だけはネットで調べてわかりました。今は、下記の状態になっています。 <script language="JavaScript">  </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
プルダウンボックスからPDFファイルを開く
プルダウンボックスで選択した際に、新しいウィンドウでPDFファイルを開きたいと考えています。以下のスクリプトで、表示しているウィンドウにリンクまでできました。 <form name="linkmenu"><td> <select name="linklist" onChange="location=this.value"> <option selected="selected">選択(PDFファイル)</option> <option value="./0002.pdf">１番</option> <option value="./0001.pdf">２番</option> </select> </form> 新しくpdfファイルを開くことはできるのでしょうか？よろしくお願いいたします。
- ベストアンサー
- JavaScript
フレームを使用した複数プルダウンメニュー
こんにちは。よくある質問もみたのですが「複数のプルダウンメニュー」「フレームを使ったプルダウン」というのはあるのですが、フレームを使用して左フレームに複数プルダウン、そこで選んだものを右フレームに表示させるというのが見つかりませんでした。「複数のプルダウンメニュー」もつくれますし、「別フレームに表示させる」こともできるのですが、プルダウンを増やしたとたんに動きません。ネームを変えてもみたのですがうまくいきません。フレームを二つつくって <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> これだと２本目が表示されません。どうすればいいか教えていただけないでしょうか？
- ベストアンサー
- JavaScript
プルダウンのメニューを別ファイルに…
掲示板の投稿フォームにある print "<input type="text" name="name">"\n"; の部分を↓に変更 print "<select name=\"name1\">"; print "<option value=\"aaa\">aaa</option>"; print "<option value=\"bbb\">bbb</option>"; print "</select>"; print "<select name=\"name2\">"; print "<option value=\"aaa\">aaa</option>"; print "<option value=\"bbb\">bbb</option>"; print "</select>\n"; $name = $FORM{'name1'} . $FORM{'name2'}; このままですと、特に何の問題もなく使えるのですが、 print "<option value=\"aaa\">aaa</option>"; print "<option value=\"bbb\">bbb</option>"; の部分をname1　name2共に随時、追加や編集等を行いたい為、別ファイルで管理したいのです。別で、name1.txt　name2.txtを作って、そこに aaa bbb というように、一列に一項目を書いて管理をしたいのです色々調べた結果、配列（Array）を使えばいい…という所まではいきついたのですが、そこから先が分からず、立ち往生しておりますどなたか、ご教授頂けませんでしょうか？よろしくお願い致します
- ベストアンサー
- CGI
プルダウンについての質問です
プルダウンメニューでリンク先にページを飛ばした後、ツールバーの <戻るボタン>でページを戻すと、同じプルダウンメニューのリンク先には飛ばなくなってしまいます。どうすればページを戻した後でも、同じプルダウンメニューのリンク先に飛ばす事が出来るのでしょうか？使ったHTMLは <FORM NAME="linkmenu"> <SELECT style="width: 220px" NAME="linklist" onchange="location=this.value"> <OPTION SELECTED>以下の項目から選択してください。</OPTION> <OPTION VALUE="index.html">1.テストページ1</OPTION> <OPTION VALUE="2.html">2.テストページ2</OPTION> <OPTION VALUE="3.html">3.テストページ3</OPTION> </SELECT> </FORM> というものです。
- ベストアンサー
- HTML
プルダウンメニューの表示について
お世話になります。ホームページを作成中ですが、文字の大中小に変更できるように設定したいです。そこで見つけてきのはプルダウンメニューで、 <form name="puru"> <select name="amu" onchange="fontsize();"> <option>14pt</option> <option>12pt</option> <option selected>10pt</option> </select> </form> これを入れるというものですが、これだとプルダウンメニューの表示は10pt、12pt 14ptという表示になってしまいます。これを利用して、プルダウンメニューの表示を大中小というふうにできないでしょうか？回答をお願いします。
- ベストアンサー
- JavaScript
複数のプルダウンメニューの作り方。
質問内容に不備があったため再度質問させて頂きます。前回答えて下さった方には大変ご迷惑をおかけします。非常に多くのものを奇麗に見せたいのでプルダウンメニューがいいと思い、作りました。・Aリスト、Bリスト、Cリスト…とプルダウンメニュー（メニューを選ぶとアンカー先に飛ぶようにしたい）を複数含んだフォームを一つのhtmlに作ったのですが、動作しません。一つのフォームに一つのプルダウンメニューは上手くいくのですが、Javascriptを二つ並べると動かなくなります。とりあえず関数名を重複しない様にしたらいいという事だけはネットで調べてわかりました。今は、下記の状態になっています。 list.html <script language="JavaScript">  </script> <form name="myForm"> <select name="myMenu" onChange="MENU()"> <option value="">A</option> <option value="list.html#a001">A001</option> <option value="list.html#a002">A002</option> <option value="list.html#a003">A003</option> </select> <select name="myMenu2" onChange="MENU()"> <option value="">B</option> <option value="list.html#b001">A001</option> <option value="list.html#b002">A002</option> <option value="list.html#b003">A003</option> </select> </form> <a id="a001" name="a001"></a>A001<br> <a id="a001" name="a002"></a>A002<br> <a id="a001" name="a003"></a>A003<br> <a id="a001" name="b001"></a>B001<br> <a id="a001" name="b002"></a>B002<br> <a id="a001" name="b003"></a>B003<br> あと、このように同じhtml内でのリンクになる場合は、optionのvalueのlist.htmlを省いてもいいのでしょうか？当方、Javascriptに関してはコピペでしか使えない程度の知識の人間です。ご指南の程宜しくお願いします。
- ベストアンサー
- JavaScript
PHPでjavascriptを表示する方法
すみません。javascriptの事はほとんど分からないのですが、 phpを使ってjavascriptを表示したいのですが基本的な部分で分かりません。例えば <?php echo"<script>document.write(\"PHP！\")</script>;" ?> は簡単にできますが、タグに入っているjavascriptはどうやってphpで表示させるのでしょうか？ <form name="aaa" method="post" action="bbb.php"> <select name="ccc" onChange="document.forms['aaa'].submit()" > <option value="111">111</option> <option value="222">222</option> </select> </form> 上記のスクリプトを単純にphpで表示したいのですが、どうやってもphpで囲むとonChangeが動かず動的にはなりません。何時間もぐぐったりしてますが解決しません。タグの中のjavascriptは直接phpでは動かせないのでしょうか？
- ベストアンサー
- PHP

プルダウンのoptionの表示・非表示はできますか？

みんなの回答

補足 2007/02/28 23:20

関連するQ&A

注目のQ&A

カテゴリ
一覧

専門家に質問してみよう
専門家登録

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

プルダウンのoptionの表示・非表示はできますか？

みんなの回答

補足 2007/02/28 23:20

関連するQ&A

注目のQ&A

カテゴリ 一覧

専門家に質問してみよう 専門家登録

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

カテゴリ
一覧

専門家に質問してみよう
専門家登録