jQuery

jQuery UIの「Datepicker」のカレンダーでは、簡単に選択可能範囲を設定できます。 たとえば、明日以降〜30日以内のみ選択可能としたい場合、minDateとmaxDateオプションを使うことですぐに実装可能です。 今日が11/27の場合、明日（11/28）以降〜 〜30日以内（12/27まで）が選択可能 DatepickerのminDate、maxDateの使い方 minDate: 選択可能な最小日付を指定 maxDate: 選択可能な最大日付を指定 数値を指定した場合 $(function () { $("#datepicker").datepicker({ minDate: 1, // 明日以降を選択可能 maxDate: 30 // 30日後まで選択可能 }); }); この場合、「明日以降〜30日以内」が選択可能範囲となります。 「今日」「1ヶ月」などを指定する場合 $(function () { $("#datepicker").datepicker({ minDate: new Date(), // 今日以降を選択可能 maxDate: "+1M" // 1ヶ月後まで選択可能 }); }); new Date()で今日の日付を設定、"+1M"で「現在から1ヶ月後」が設定可能。この場合、「今日〜1ヶ月後」が選択可能範囲となります。 そのほかにも、"+1w"（1週間後）、"+7d"（7日後）などが指定可能です。 minDate、maxDateを更新する $("#datepicker").datepicker("option", "minDate", "2024-12-01"); $("#datepicker").datepicker("option", "maxDate", "2024-12-31"); これにより、minDateとmaxDateを変更可能です。 3つめには以下の形式が指定可能です。 日付（例："2024-12-01"） Dateオブジェクト（例：new Date(2024, 11, 1)） 相対的な値（例："+1w"） minDate、maxDateをリセットする $("#datepicker").datepicker("option", "minDate", null); $("#datepicker").datepicker("option", "maxDate", null); jQuery Datepickerの関連記事 Datepicker beforeShowDayの使い方

jQuery

【jQuery UI Datepicker】beforeShowDayの使い方と活用例

【jQuery】DatepickerのminDate、maxDateで日付の選択可能範囲を制御する