javascriptでセレクトボックスの"selected"を動的につける方法について質問させてください。
現在、以下のようなフォームを作成しました。
<select name='year'>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年
<select name='month'>
<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>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
</select>月
<select name='day'>
<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>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
<option value='13'>13</option>
<option value='14'>14</option>
<option value='15'>15</option>
<option value='16'>16</option>
<option value='17'>17</option>
<option value='18'>18</option>
<option value='19'>19</option>
<option value='20'>20</option>
<option value='21'>21</option>
<option value='22'>22</option>
<option value='23'>23</option>
<option value='24'>24</option>
<option value='25'>25</option>
<option value='26'>26</option>
<option value='27'>27</option>
<option value='28'>28</option>
<option value='29'>29</option>
<option value='30'>30</option>
<option value='31'>31</option>
</select>日
このセレクトボックスに、例えば今日の日付"2010年9月30日"だったら、それぞれの年、月、日の<option>に"selected"をつけたいのですが、javascriptではどのようにして実現したら良いのでしょうか?
よろしくお願いします。
No.3ベストアンサー
- 回答日時:
こんな感じで・・・
<script>
window.onload=function(){
var f=document.getElementById("f0");
var ymd=new Date();
checkSelect(f.elements["year"],ymd.getFullYear());
checkSelect(f.elements["month"],ymd.getMonth() +1);
checkSelect(f.elements["day"],ymd.getDate());
}
function checkSelect(obj,val){
for(var i=0;i<obj.length;i++){
if(obj[i].value==val){
obj[i].selected=true;
break;
}
}
}
</script>
<form id="f0">
<div>
<select name='year'>
<option value='2009'>2009</option>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年
<select name='month'>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
</select>月
<select name='day'>
<option value='29'>29</option>
<option value='30'>30</option>
<option value='31'>31</option>
</select>日
</div>
</form>
No.2
- 回答日時:
optionのselectedにtrueを設定すれば選択状態になります。
たとえば、
<script type="text/javascript">
window.onload = function() {
var today = new Date();
var year = today.getYear();
var month = today.getMonth();
var day = today.getDate();
selectOption(document.フォーム名.year, year);
selectOption(document.フォーム名.month, month+1);
selectOption(document.フォーム名.day, day);
};
function selectOption(obj, value) {
for (var i = 0, len = obj.length; i < len; i++) {
if (obj[i].value == value) {
obj[i].selected = true;
return;
}
}
}
</script>
とか。
No.1
- 回答日時:
<script type="text/javascript">
<!--
window.onload = function(){
var today = new Date();
var year = today.getFullYear();
var month = today.getMonth()+1;
var day = today.getDate();
var options=document.getElementsByTagName("option");
for(var i=0;i<options.length;i++){
if(options[i].text==year)
options[i].selected="selected";
if(options[i].text==month)
options[i].selected="selected";
if(options[i].text==day)
options[i].selected="selected";
}
}
// -->
</script>
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript JavascriptからSQLへ繋ぎ方が分からない 3 2022/07/07 00:27
- JavaScript console.logがどうしても2つ機能しないのでアドバイスをくださいお願いします 2 2022/07/07 22:13
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- JavaScript 中百舌鳥駅と深井駅を入れ替えて選択しても同じ挙動にしたいです。 2 2022/06/24 18:45
- JavaScript セレクトボックスを2つ選択してメッセージなどを表示するには。~運賃検索プログラムを完成させたい~ 1 2022/07/22 11:10
- JavaScript 1度きりではなく、繰り返し、挙動が変わるようにしていただきたいです。 1 2022/07/03 15:50
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
- JavaScript 2段階プルダウンで1段階目の選択を終えた後に選択ボックスを見えなくしたい 2 2022/07/05 21:58
- JavaScript jsでは、'で区切った部分を改行することはできない。〇か×か。 1 2022/06/26 19:58
- JavaScript 電車の運賃を出すプログラムを作っています。 2 2022/06/22 09:36
このQ&Aを見た人はこんなQ&Aも見ています
-
性格の違いは生まれた順番で決まる?長男長女・中間子・末っ子・一人っ子の性格の傾向
同じ環境で生まれ育っても、生まれ順で性格は違うものなのだろうか。家庭教育研究家の田宮由美さんに教えてもらった。
-
リクエストに応じたselectedの初期値設定方法
Java
-
JSPのNULLレコード表示について教えて下さい。
Java
-
セレクトボックスのselected属性の値について
HTML・CSS
-
-
4
セレクトボックスの初期選択状態(SELECTED)を動的にしたいのですが
JavaScript
-
5
フォーム上で押されたボタンによってサーブレットの処理を変えたい
Java
-
6
javaでDBから取得したデータのJSP表示
Java
-
7
全てのselect要素をデフォルトの値に戻す方法
JavaScript
-
8
JSPで<SELECT>の中にDBから持ってきたデータを反映させたい
Java
-
9
JSPでのリストボックス表示
Java
-
10
MySQLでデータベースにデータinsert時のエラー。
Java
-
11
Selectの中身をfor文で入れる
JavaScript
-
12
プルダウンメニューにDBの内容を表示させる
PHP
-
13
テーブルタグの中にdivを含めてはダメ?
HTML・CSS
-
14
count(*)で取得した値をJAVAの変数に代入するには?
Java
-
15
今日の日付を自動的にセレクトしたいのですが・・・。
JavaScript
-
16
レコード件数の表示
Java
-
17
複数のテーブルから値を合計出力するSQLについて
MySQL
-
18
DBの値をチェックボックスに反映させたい
PHP
-
19
onClickで関数呼出し後に、結果に応じてsubmitを実行する方法
JavaScript
-
20
JSPの処理の途中で、JavaScriptの処理をしたい
JavaScript
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
中百舌鳥駅と深井駅を入れ替え...
-
コードレビューをお願いします。
-
【JS】selectでchangeした時の...
-
JavaScriptで<select>の<option...
-
ホームページ作成 自動見積計算
-
javascriptでセレクトボックス...
-
1度きりではなく、繰り返し、挙...
-
VBScriptでHTMLのセレクトボッ...
-
ラジオボタンの値が取得できな...
-
javascriptで合計金額を算出し...
-
プルダウン選択を変更すると、...
-
select要素のvalueを配列で取得...
-
プルダウンで選択した項目にあ...
-
プルダウンの値によって活性・...
-
ラジオボタンとプルダウンを連...
-
全てのselect要素をデフォルト...
-
selectを変更不可にしたい
-
option 選択による表示&非表示
-
selectボックスで選択数を制限...
-
今日の日付を自動的にセレクト...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
プルダウン選択を変更すると、...
-
複数のプルダウンを1つにまとめ...
-
全てのselect要素をデフォルト...
-
select要素のvalueを配列で取得...
-
Selectボックスの一覧表示方法
-
javascriptでセレクトボックス...
-
selectを変更不可にしたい
-
ラジオボタンとプルダウンを連...
-
同じ名前のセレクトがある場合...
-
JavaScriptで<select>の<option...
-
<input>の選択肢をプルダウンメ...
-
VBScriptでHTMLのセレクトボッ...
-
【javascript】連想配列からセ...
-
webページの一部のみの更新につ...
-
3つのselectでURLパラメータを...
-
プルダウンの値によって活性・...
-
セレクトボックスで配列を呼び...
-
プルダウンの選択値により活性...
-
3つの連動したプルダウンメニュ...
-
selectボックスで選択数を制限...
おすすめ情報