初心者です。よろしくお願いします。
###やりたいこと
0. デフォルトで現在日付を選択状態としたい
0. 利用開始日なので過去日付を選択できないようにしたい
###やったこと
HTML
1<form method="post"> 2 <div> 3 <label>利用開始日</label> 4 <div> 5 <select id="year"></select>年 6 <select id="month"></select>月 7 <select id="day"></select>日 8 </div> 9 </div> 10</form>
Javascript
1var time = new Date(); 2var year = time.getFullYear(); 3var selected = ' selected="selected"'; 4 5for (var i = year; i <= year + 5; i++) { 6 $('#year').append('<option value="' + i + '"'+ (i == year ? selected : '') +'>' + i + '</option>'); 7} 8for (var i = 1; i <= 12; i++) { 9 $('#month').append('<option value="' + i + '"'+ (i == time.getMonth() + 1 ? selected : '') +'>' + i + '</option>'); 10} 11for (var i = 1; i <= 31; i++) { 12 $('#day').append('<option value="' + i + '"'+ (i == time.getDate() ? selected : '') +'>' + i + '</option>'); 13}
###つまっているところ
上記やりたいことの1は実現できたのですが2を実現するための実装方法がわかりません。
現在日付を2017年9月2日とした例:
- 2017年9月2日〜2022年12月31まで選択可としたい
(※Toを+5年としていますがこだわりはなく仮の値としています)
- 0000年1月1日〜2017年9月1日まで選択不可としたい
エラーが出て詰まっているというわけではなく、選択された年によって選択できる月日を動的に変更したいがその実現方法がわからないという状況です。
よろしくお願いします。
###追記
やりたいこと2の「選択された年によって選択できる月日を動的に変更したい」とはどういうことか、上記例でもう少し詳細に書きます。難しい書き方をしてしまいましたが考え方は単純です。
初期状態で2017年9月2日(現在日付)が選択されていた場合:
- この状態で月のセレクトボックスを見ると9〜12しか表示されない
- この状態で日のセレクトボックスを見ると2〜31しか表示されない
→要は過去日を除いて未来日が選択できる状態
上記状態で年を2017から2018年(未来年)に変更した場合:
- この状態で月のセレクトボックスを見ると1〜12を表示
- この状態で日のセレクトボックスを見ると1〜31しか表示されない
→要は未来日がすべて選択できる状態
回答2件
あなたの回答
tips
プレビュー