OPTIONタグにループは使えないでしょうか?

このQ&Aのポイント
  • <SELECT name="cmbTT"> <OPTION value="0">0</OPTION> <OPTION value="1">1</OPTION> <OPTION value="2">2</OPTION> <OPTION value="3">3</OPTION> </SELECT> 上記のような選択ボックスを配置しました。実際23まであります。
  • こういった選択ボックスがいくつかあるためJavaScriptか何かで繰り返し制御してできないでしょうか? for(i=0;i>23;i++) { <OPTION value="i">i</OPTION> } 上記のように作成する方法はないでしょうか? どなたかご存知の方教えて下さい。
  • 宜しく御願いいたします
回答を見る
  • ベストアンサー

OPTIONタグにループは使えないでしょうか?

<SELECT name="cmbTT"> <OPTION value="0">0</OPTION> <OPTION value="1">1</OPTION> <OPTION value="2">2</OPTION> <OPTION value="3">3</OPTION> </SELECT> 上記のような選択ボックスを配置しました。実際23まであります。 こういった選択ボックスがいくつかあるためJavaScriptか何かで繰り返し制御してできないでしょうか? for(i=0;i>23;i++) { <OPTION value="i">i</OPTION> } 上記のように作成する方法はないでしょうか? どなたかご存知の方教えて下さい。 宜しく御願いいたします

  • a50
  • お礼率31% (55/176)
  • HTML
  • 回答数1
  • ありがとう数1

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

  • ベストアンサー
回答No.1

ん~スマートじゃないけど <form> <SCRIPT LANGUAGE="JavaScript"> document.write("<SELECT name='cmbTT'>"); for(i=0;i<23;i++) { document.write("<OPTION value='"); document.write(i); document.write("'>"); document.write(i); document.write("</OPTION>"); }; document.write("</select>"); </SCRIPT> </form> なんてどうかな? 一応、”と’を使い分けたつもりだけど・・・ &や+でもっと行数は減らせるけど分かりやすくしたつもりです。 蛇足ながらi>23では動かないでしょ?

a50
質問者

お礼

有難うございます。できました。 document.writeを使うのですね

関連するQ&A

  • 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タグの選択することをしたいのですが不可能なのでしょうか?

  • HTMLタグのoptionで

    画像の利用希望時間のところで時間を選択するようにしているのですが、 前の画面からPOST送信で送られた「$start1」という変数が選択された状態にしたいとおもっているのですが、どうもうまくいきません。 どなたかわかるかたいらっしゃったらお願いします。 したのコードは、利用時間の所のコードです。 <tr> <td>利用希望時間</td> <td> <select name="start1"> <option value="">-- <option>9<option>10<option>11<option>12 <option>13<option>14<option>15<option>16<option>17 <option>18<option>19<option>20<option>21 </select> : <select name="start2"> <option value="">-- <option>00 <option>30 </select> ~ <select name="end1"> <option value="">-- <option>9<option>10<option>11<option>12 <option>13<option>14<option>15<option>16<option>17 <option>18<option>19<option>20<option>21 </select> : <select name="end2"> <option value="">-- <option>00 <option>30 </select>

  • HTMLのSELECTタグの使い方、JSPのセッション格納について

    HTMLのSELECTタグの使い方、JSPのセッション格納について Jspで開発をしております。IE7以上です。 同一画面内でボックスで選択した値をそのままセッションに格納したいのです。 Javascriptで制御したいのですが、なにかいい方法をご存知ですか? <script type="text/javascript"> function test(obj) { with(obj) { form.text1.value = options[selectedIndex].value; } } </script> <SELECT NAME="select1" onchanged="test(this)"> <OPTION VALUE=1>First <OPTION VALUE=2 selected>Second <OPTION VALUE=3touya">Theard </SELECT> またselectedでは初期の表示のみ選べて値の初期値はscript側で設定するのでしょうか? これだとボックスに変化があれば値が取得できるみたいです。 できればボックスをいじらなければ初期表示の値をセッションに格納。 ボックスをいじれば選択した値をセッションに格納。

  • Javascriptの動的リスト作成について

    Javascriptの動的リスト作成について お世話になっています。 Javascriptで選択リストを動的に変えたいと思っています。 また、Javascriptで作成したリストは、multipleとして複数選択できるようにしたいと考えています。 そこで、下記のようにスクリプトを書きました。リスト2(smallwheretag)が1つのみ選択を許すときは、うまくいったのですが、multipleにするためにnameを配列にしたところ、うまくリストが作成できなくなってしまいました。 なにかスクリプトに変更が必要なのでしょうか?ご教授お願いいたします。 <HTML部> <select name="bigwheretag[]" onchange="javascript:listChange(this.value);"> <option value="">検索項目</option> <option value="11%">自然</option> <option value="12%">街</option> <option value="13%">家庭</option> </select> <select name="smallwheretag[]" multiple> <option value="">大項目を選択して下さい</option> </select> <Javascript部> var where1_text = new Array("川", "海", "山", "滝", "その他"); var where1_value = new Array("1101", "1102", "1103", "1104", "1199"); flag1 = document.form.bigwheretag.value; if (flag1=="11%") { document.form.smallwheretag.length = where1_text.length; for(var i=0; i<where1_text.length; i++) { document.form.smallwheretag.options[i].text = where1_text[i]; document.form.smallwheretag.options[i].value = where1_value[i]; } }・・・・・・・・以下同様

  • selectboxのoptionタグのvalue以外の値を表示したい

    selectboxのoptionタグにvalue以外に、titleに値を持たせて、その値を表示したいと考えています。 IE7はうまくいきますが、IE6でうまくいきません。 Javascriptで、IE6でも動作できるように実現したいです。 やりたいことは、選択肢「A」にマウスをあわしたら「B」が表示され 選択肢「AA」にマウスをあわしたら「BB」が表示されるように したいです。 <SELECT name=NAME_1 > <OPTION value="A" title="B">A</OPTION> <OPTION value="AA" title="BB">AA</OPTION> </SELECT> ご指導のほど、よろしくお願いいたします

  • セレクトボックスの操作

    <select name="example1"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> </select> <input type="submit" name="1" value="追加"> 例えば、上記のセレクトボックスの3を選択して送信ボタンを押したら、3以外の4つの数字の値を持ったセレクトボックス(select name="example2)を出現させたいのです。(example1を残したまま) 選択した数字以外の値を持ったセレクトボックスを出現させたいです。 <select name="example2"> <option value="1">1</option> <option value="2">2</option> <option value="4">4</option> <option value="5">5</option> </select> <input type="submit"name="2" value="追加"> 上記のようになります。example2の1を選択し送信したら <select name="example3"> <option value="2">2</option> <option value="4">4</option> <option value="5">5</option> </select> <input type="submit" name="3" value="追加"> 上記のようになります。 上記の手順でセレクトボックスが3つに増えた場合のソースは次のような感じに <select name="example1"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> </select> <input type="submit" name="1" value="取り消し"> <select name="example2"> <option value="1">1</option> <option value="2">2</option> <option value="4">4</option> <option value="5">5</option> </select> <input type="submit"name="2" value="取り消し"> <select name="example3"> <option value="2">2</option> <option value="4">4</option> <option value="5">5</option> </select> <input type="submit" name="3" value="追加"> 取り消しを押した場合、そのセレクトボックスを削除し、一番新しいセレクトボックス(example3)に削除された値を追加したいです。 example2を取り消した場合、 <select name="example3"> <option value="1">1</option> <option value="2">2</option> <option value="4">4</option> <option value="5">5</option> </select> <input type="submit" name="3" value="追加"> 上記のようになります。 どのように記述すれば実現可能でしょうか? ご教示頂けますと幸いです。 宜しくお願いいたします。

  • Strutsでoptionタグの作り方

    例えばActionFormのメンバにBeanのリストがあるとして、 JSPではStrutsのhtmlタグを使ってselectボックスのoptionに ActionForm内のBeanリストをセットする方法を教えて下さい。 具体的に実現したいことは以下のような事です。 例> // アクションフォーム public sampleForm extends ActionForm {  private List<sampleBean> sampleBeanList; // getter、setterは省略 } // JSPでStrutsタグ(<html:select>とか<html:options>)を使って以下のようなセレクトボックスを作成したい! // 実現方法をご存知のかた、どうかご教示ください。 <select> <option value="sampleBeanのプロパティ">sampleBeanのプロパティ</option> <option value="sampleBeanのプロパティ">sampleBeanのプロパティ</option> <option value="sampleBeanのプロパティ">sampleBeanのプロパティ</option> <option value="sampleBeanのプロパティ">sampleBeanのプロパティ</option> </select> ちなみに環境は以下の通りです。 Java 1.6 Struts 1.3.8 Tomcat 6 以上、宜しくお願い致します。

  • セレクトボックスの連動

    セレクトボックスAを切り替えると、他のセレクトボックスがAと同じになるようなものを作りたいのですが、うまくいきません。 ソースは以下の通りです。 function ChangeSelect() { var index = formA.selectA.selectedIndex; for (i=1,i<formB.selectCnt.value,i++) { if (i == index) { FormB.selectB1.options[index].value ); } } } <form name="formA"> <select name="selectA" onchange="javascript:ChangeSelect()"> <option value="りんご">りんご <option value="みかん">みかん <option value="いちご">いちご </select> </form> <form name="formB> <input type="hidden" name="selectCnt" value=***> <select name="selectB1"> <option value="りんご">りんご <option value="みかん">みかん <option value="いちご">いちご </select> </form> 存在するセレクトボックスは全て同じ値が入っています。 formAにはセレクトボックスは1つですが、formBにあるセレクトボックスは0~複数と場合によって異なります。 formBにあるセレクトボックスはselectB1、selectB2、selectB3という感じに最後の数字のみが異なるnameがつくようにしています。 <input type="hidden" name="selectCnt" value=***>のvalueには、ASPで数えたセレクトボックスの数を入れています(セレクトボックスが10個あれば10と入ります) 数が決まっていればFormB.selectB1.options[index].valueを数の分だけ増やせばいいのですが、0の時もあれば10の時もある、という場合にはどういう風に書けばいいのかわかりません。 どのように記述すれば良いのでしょうか。アドバイスお願いします><

  • セレクトメニューの4連動

    いつも参考にさせて頂いております。 javascript初心者です。 現在、javascriptにてセレクトメニューの4連動を作成しているのですが、4つ目のセレクトメニューを正常に動かすことが出来ません・・・。何とか3つまでは動くようになったのですが・・・。忙しいところを申し訳ありませんが、教えて下さい。 一つ目のセレクトで、地域の選択 二つ目のセレクトで、県の選択 三つ目のセレクトで、「プレイスポット」か「食事」の選択 四つ目のセレクトでは、 プレイスポット名(三つ目でプレイスポット選択時) お店名(三つ目で食事選択時) 上記したようにしたいのです。宜しくお願いします。 <html> <head> <script type="text/javascript"> <!-- var area=0; function setA(n) { aa=n; data1 = [ ["東京","神奈川"], ["大阪","神戸"], ]; len = document.form1.box_a.options.length; for(i=len-1; i>0; --i) document.form1.box_a.options[i] = null; if(n!=0) { document.form1.box_a.style.visibility = "visible"; for(i=0; i<data1[n-1].length; i++) document.form1.box_a.options[i+1] = new Option(data1[n-1][i]); } setB(0); } function setB(n) { data2 = [ [["プレイスポット","食事"],["プレイスポット","食事"]], [["プレイスポット","食事"],["プレイスポット","食事"]] ]; len = document.form1.box_b.options.length; for(i=len-1; i>0; --i) document.form1.box_b.options[i] = null; if(n==0)return; document.form1.box_b.style.visibility = "visible"; for(i=0; i<data2[aa-1][n-1].length; i++) document.form1.box_b.options[i+1] = new Option(data2[aa-1][n-1][i]); setC(0); } function setC(n) { data3 = [ [[["としまえん","よみうりランド"],["キハチ","久兵衛"]]], [[["江ノ島","鎌倉"],["カレーミュージアム","中華街"]]], [[["ユニバーサルスタジオ","天王寺動物園"],["かに道楽","金龍ラーメン"]]], [[["須磨海浜水族園","グリコピア"],["コンチェルト","六甲山牧場"]]] ]; len = document.form1.box_c.options.length; for(i=len-1; i>0; --i) document.form1.box_c.options[i] = null; if(n==0)return; document.form1.box_c.style.visibility = "visible"; for(i=0; i<data3[aa-1][n-1][n-1].length; i++) document.form1.box_c.options[i+1] = new Option(data3[aa-1][n-1][n-1][i]); } //--> </script> </head> <body> <form name="form1"> <select name="sel1" onChange="setA(this.selectedIndex)"> <option value="0" selected>▼選択してください</option> <option value="1">関東</option> <option value="2">関西</option> </select> <select name="box_a" onChange="setB(this.selectedIndex)"><option value="0" selected>---------------</option></select> <select name="box_b" onChange="setC(this.selectedIndex)"><option value="0" selected>---------------</option></select> <select name="box_c" onChange=""><option value="0" selected>---------------</option></select> </form> </body> </html>

  • リストボックス全選択について

    JavaScriptについて質問です。 リストボックスA,B と プルダウンC という画面項目があると仮定し、 submitボタンを押下したとき、 リストボックスA,Bの項目全てが全選択され、プルダウン項目はそのままにしたいと考えております。 下記のソースのように作成したのですが、 リストボックスが全選択されるところまでは良いのですが、 プルダウン項目が最後の項目が選択された状態になってしまいます。 リストボックスだけが全選択され、プルダウン項目はそのままにするにはどうしたら良いでしょうか。 かなり困ってます。 どなたか助けてください。。 以下ソースです。 <html> <head> <script language="JavaScript"> <!-- function selectAll(){  var str = document.getElementsByTagName("option"); for(i=0;i<str.length;i++){ str[i].selected = true; } } //--> </script> </head> <body> <table> <tr> <td> リストA<br> <select name="listboxA" multiple> <option value="サンプル1">サンプル1</option> <option value="サンプル2">サンプル2</option> <option value="サンプル3">サンプル3</option> </select> </td> <td> リストB<br> <select name="listboxB" multiple> <option value="サンプル4">サンプル4</option> <option value="サンプル5">サンプル5</option> <option value="サンプル6">サンプル6</option> </select> </td> <td> プルダウンC<br> <select name="Pdown"> <option value="サンプル7">サンプル7</option> <option value="サンプル8">サンプル8</option> <option value="サンプル9">サンプル9</option> </select> </td> </tr> </table> <br> <input type=submit value="送信" onClick="selectAll()"> </body> </html>

専門家に質問してみよう