Written by Kasumi

jQuery UI Datepickerで本日を基準に過去を非選択。選択可能日を設定する方法

jQuery UI Datepickerで本日を基準に過去の日付を非選択にしたい。

本日を基準に選択できる開始日を設定したい。

本記事ではこのような悩みを解決します。

本日より過去の日付を非選択にする。

$('#datepicker').datepicker({
  minDate: new Date()
});

本日より過去の日付を非選択にするコード例です。

minDateオプションを追加します。

値にnew Date()関数を入れる事で過去の日付を非選択にできます。

選択開始日を設定する

$('#datepicker').datepicker({
 //4日後から選択開始にする
  minDate: "+4d"
});

過去だけではなく、本日から翌日・n日後を開始日としてそれ以前を非選択にするコード例です。

同じくminDateオプションを使用。

値を“+任意n日d”とすることで、任意の開始日を選択できます。

まとめ

jQuery UI Datepickerで本日を基準に選択可能日を設定する方法について紹介しました。

以上で解説を終わります。

目次

関連記事

jQuery

複数設置に対応したタブ切り替えをjqueryで実装しよう

更新日:2022.09.09
3848
jQuery

【簡単】jQueryプラグインのlightboxを使って、画像モーダルウィンドウを実装しよう。

更新日:2022.09.09
5672
HTMLCSS jQuery

一枚画像に複数のリンクを場所指定して設置する方法【レスポンシブ対応】

更新日:2022.09.09
2678
jQuery

【グロナビ】複数あるプルダウンメニューで切り替えを実装する方法【jQuery】

更新日:2022.09.09
1667