• ベストアンサー

JavaScript で動的に <SELECT>の<OPTION>を追加したい

HTML の <FORM> の <SELECT> <OPTION VALUE="11">AAA</OPTION> の<OPTION >を JavaScript で設定しようと考えています。 方法ご存知の方いらっしゃいましたら、御教授願います。 また、JavaScript のメソッド/プロパティが網羅的に記述されている Web Page 等ありましたら、ぜひURLを教えてください。 よろしくお願い致します。

  • sho_ta
  • お礼率68% (221/322)

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

  • ベストアンサー
  • a-kuma
  • ベストアンサー率50% (1122/2211)
回答No.1

> の<OPTION >を JavaScript で設定しようと考えています。 例えば、こんな感じでやります。 <form name="F"> <select name="S"> </select> </form> <!-- ★★★★★★ ここから --> <script type="text/JavaScript"> S = document.X.S; if (S.options.length < 1) { S.options[0] = new Option("ラベル1", "値1"); S.options[1] = new Option("ラベル2", "値2"); S.options[2] = new Option("ラベル3", "値3"); history.go(0); } </script> "ラベルn" が属性 label に対応し、"値n" が属性 value に対応します。 > また、JavaScript のメソッド/プロパティが網羅的に記述されている Web Page 等ありましたら、ぜひURLを教えてください。 私は、本家のページ(→参考URL)を良く見ます。

参考URL:
http://developer.netscape.com/docs/manuals/communicator/jsref/index.htm
sho_ta
質問者

お礼

大変助かりました。 またよろしくお願いします。

関連するQ&A

  • [JavaScript+<select>]最初から5文字一致でセレクト状態にしたい。

    こんばんは。 HTMLとJavaScriptで簡単な動的ページを作成しています。 そこで、行き詰っていることがありますのでご相談を・・・。 こういう<SELECT>があるとします・・・。 <FORM name="myform"> <SELECT name="menu"> <OPTION value="item1001">メニュー1</OPTION> <OPTION value="item2001">メニュー2</OPTION> </SELECT> </FORM> 初期値を「メニュー2」にしたい場合・・・これをJavaScriptで指定する場合、ONLOADのタイミングで・・・ document.myform.menu.value = "item2001"; とすればいけます。 今回は・・・"item2"だけの情報でヒットさせたいと思っています。 つまり、optionのvalue値の頭から5桁だけのマッチングでセレクト状態にさせたいのです。 ループという形をとらずにセレクトさせる方法を探しています。 テクニックをご教授下さい・・・。 宜しくお願い致します。

  • <SELECT>内<OPTION>の内容を曜日で変えるには?

    <FORM name="BGM"> <SELECT name="change"> <OPTION selected>選曲♪</OPTION> <OPTION value="○○○.mid">曲1</OPTION> <OPTION value="○○○.mid">曲2</OPTION> <OPTION value="○○○.mid ">曲3</OPTION> <OPTION value="○○○.mid ">曲4</OPTION> </SELECT>  <INPUT onclick="bgm_change()" type="button"> </FORM> 今、このような形で、<SELECT>を使ってBGMを4曲から選べる機能を成功させています。 この、<SELECT>の<OPTION>のプルダウンの内容を、 曜日ごとで変えたいと思っています。 今日の曜日を取得するJavascriptは、 Function WhatDayWeek() と言う名の関数で、     Week = new Array(7); DATE = new Date(); thisweek = Week[DATE.getDay()]; 以上のように作っていますが、 このJavascriptと、<SELECT><OPTION>をくっ付ける(反映させる)にはどう記述すればよいでしょうか? 関数自体、この3行では足りないんでしょうか・・。 どなたかご教授下さい。

    • ベストアンサー
    • HTML
  • javascriptについての質問です。複数の一つのselect等で選

    javascriptについての質問です。複数の一つのselect等で選択した文字の値をinputに表示したいのですが <FORM> <SELECT NAME="select1"> <OPTION VALUE=""></OPTION> <OPTION VALUE=" a">a</OPTION> <OPTION VALUE=" b">b</OPTION> <OPTION VALUE=" c"c</OPTION> </SELECT> <SELECT NAME="select2"> <OPTION VALUE=""></OPTION> <OPTION VALUE=" 壱">壱</OPTION> <OPTION VALUE=" 弐">弐</OPTION> <OPTION VALUE=" 参">参</OPTION> </SELECT> <input TYPE="text" NAME="text1" VALUE=""> </FORM> とこの様なフォームがあるとしまして 各SELECT で選択した各文字を <input TYPE="text" NAME="text1" VALUE="">に追加したいんです。 SELECT一つなら出来たのですが 複数になると追加をどうするのかやり方がわからなくて・・・ 一つのセレクトは一つしか選択できなくなればなお良いのですが・・・ どなたがご教授願えないでしょうか?

  • JavaScriptのSELECTの値について

    JavaScriptについて、質問させてください。 html1からhtml2にSELECTで選択した値を渡すプログラムを作成しています。 下はそのソースです。 <html> <head></head> <body> <form method="POST" action="html2" onSubmit="入力チェック"> <table> <tr> <td>項目A-1</td> <td>項目A-2</td> <td> <select name="selname1"> <option value="0">0</option> <option value="1,11,111">1</option> <option value="2,22,222">2</option> </select> </td> </tr> <tr> <td>項目B-1</td> <td>項目B-2</td> <td> <select name="selname2"> <option value="0">0</option> <option value="3,33,333">3</option> <option value="4,44,444">4</option> </select> </td> </tr> </table> </form> </body> </html> 項目は全部で10ほどあるので、途中省略しています。 SELECTで0以外が選ばれていた場合に、それに関連する項目情報と optionのvalueをhtml2に送信させて、一覧表のように表示させたいと思います。 JavaScriptのDOMやループ文を使うようですが、 私は専門外なので、どのような処理を組めばよいかわかりません。 どなたか、わかる方ご教示願います。

  • JavaScriptで書かれたOptionタグをVBAで選択する方法

    <SCRIPT language="JavaScript"> document.write("<SELECT name=aaa><OPTION value=A>1</OPTION><OPTION value=B>2</OPTION><OPTION value=C selected>3</OPTION></SELECT>") </SCRIPT> 上記のJavaScriptで書かれたOptionタグをVBAから objIE.Document.forms(0).aaa.Item(1).Selected = True と選択しても動かすことが出来ませんでした。 VBAからJavaScriptで書かれたOptionタグの選択することをしたいのですが不可能なのでしょうか?

  • javascriptについての質問です。複数のselect等で選択した

    javascriptについての質問です。複数のselect等で選択した文字の値をinputに表示したいのですが2 こちらで <script> function changeFunc(f){ f.elements["text1"].value=f.elements["select1"].value+f.elements["select2"].value; } </script> <FORM> <SELECT NAME="select1" onchange="changeFunc(this.form)"> <OPTION VALUE=""></OPTION> <OPTION VALUE=" a">a</OPTION> <OPTION VALUE=" b">b</OPTION> <OPTION VALUE=" c">c</OPTION> </SELECT> <SELECT NAME="select2" onchange="changeFunc(this.form)"> <OPTION VALUE=""></OPTION> <OPTION VALUE=" 壱">壱</OPTION> <OPTION VALUE=" 弐">弐</OPTION> <OPTION VALUE=" 参">参</OPTION> </SELECT> <input TYPE="text" NAME="text1" VALUE=""> </FORM> というプログラムを教えていただいたのですが 最新のブラウザーではどれもが動作するのですが IE5.IE6.IE7で動かなくて困っております。 IE5は仕方ないカナとも思ってしまったりするのですが IE6 IE7では動いて欲しくて困っています。 どなたか助けていただけないでしょうか

  • Javascriptでセレクトメニューの選択チェックの方法

    Javascriptでセレクトメニューのフォームをチェックしたいのですが、 リストメニューの「選択して下さい」を選んだままだと、「番号を選択して下さい。」とエラーを出したいのですが、下記の様に書いてみたのですが、うまく動きません…どのように書けばいいか教えて下さい。宜しくお願いします。 <script language=\"JavaScript\"> <!-- function Check() { var str = document.form.a.value; if(document.form.a.value == "0") { alert("番号を選択して下さい"); } //--> </script> <form id="form" name="form" method="post" action="##"> <select name="a" onblur="Check();"> <option value="0">選択して下さい</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> <input type="submit" name="Submit" value="登録" onClick="Check();"> </form>

  • セレクトボックスのname属性が配列の時の指定方法

    お世話になります。 カテゴリがPHPかJavaScriptか迷ったのですが、直接的にはJavaScriptなのでこちらで失礼します。 現在PHPを使用してサイトを作成しております。 その中で2週間分のデータを記載したセレクトボックス(計14個)があるため、以下のように設定しました。 -----------------------------以下が7回続く <select name="nowweek[]"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> <select name="nextweek[]"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> ------------------------------ この書き方でPHPでは問題なくデータの登録が出来たのですが、このセレクトボックスを使用してJavaScriptを動かさなくてはならなくなってしまいました。 この場合のセレクトボックスのnameをどう記述すればよいのでしょう? いろいろ試したり探したりしたのですがエラーが出るばかりです。 ------------------------------試した例 document.form1.nextweek[1].selectedIndex=document.form1.nowweek[1].selectedIndex; ------------------------------ 説明がおぼつかなく申し訳ございませんが、お解りになるかたがいらっしゃいましたらよろしくご教授ください。

  • JavaScript Form OPTION value

    JavaScript初心者です。 FormとJavaScriptでしたいことがあるのですが、 知識がなくて困っています。わかる方いましたら ご教授くださいm(_ _)m (ショッピングカートの)フォームのオプション選択の ドロップダウンメニューで、オプションを選択すると それに反応して、その横に配置した画像を変える~ という事がしたいです。 以下のURLにサンプルを見つけて、これと同じことがしたい! と思ったのですが… ■ドロップダウンメニューで画像が変わる(JavaScript) http://www.mdn.co.jp/webcre/Tips/Vol12/js_imagechange02.html このサンプルではフォームの OPTION value に0などナンバリングをしておいて、Javascriptで if(fname==0){document.imgsmp.src=img0.src;} など数字を指定して読み込むようになっていますが、 自分の環境の場合、フォームのオプション選択ごとに 価格を変えるため、OPTION valueに、 OPTION value="グリーン,3000" というようにオプション名と追加価格を記入しています。 こういった場合、どの用にしたらいいのでしょうか? 自分のフォームのソースの一部を以下に書きます。 --------------------Form----------------------------- <INPUT type="hidden" class="select_erea" name="option_price_name" value="オプション名"> <SELECT name="option_price" size="15" > <OPTION value="レッド,1000">レッド</OPTION> <OPTION value="オレンジ,2000">オレンジ</OPTION> <OPTION value="グリーン,3000">グリーン</OPTION> </SELECT> ----------------------------------------------------- 質問も初めてなので、至らない点が多々あるかと思いますが、 よろしくお願いします。

  • JavascriptでSELECT要素の先頭に追加

    JavascriptでHTML上のSELECT要素のOPTIONをはき出しています。 obj = document.forms[formid].elements[elementsid]; var wkLength = 50; for(i=1;i<wkLength;i++){ obj.options[i].value = i; obj.options[i].text = i + '個'; } ***** <-ここで「obj.options」の先頭に追加したい このリストの先頭にvalue=""、text="▼"をfor文の後で挿入したいと考えています。 配列の先頭に追加する「unshift」のような構文で、for文の後に記述できる方法はありますか? よろしくお願いします。

専門家に質問してみよう