「jQuery」カレンダーDatepickerの初期日付(defaultDate)を設定する

2022年4月18日

環境
jquery.min.js 3.6.0
jquery-ui.min.js 1.13.1

書式
日本語のカレンダー設定
$.datepicker.setDefaults($.datepicker.regional[“ja"]);
$(セレクタID).datepicker({
defaultDate: new Date(年YYYY,月MM-1,DD)
});
開発元
https://api.jqueryui.com/datepicker/

使用例

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.13.1/themes/smoothness/jquery-ui.css">
<!-- テキスト入力欄 -->
<p>開始日: <input type="text" id="startdate" /></p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.13.1/jquery-ui.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1/i18n/jquery.ui.datepicker-ja.min.js"></script>
<script>
      $(function() {
    　　//日本語の設定
            $.datepicker.setDefaults($.datepicker.regional["ja"]);
        //datepickerでカレンダーを開きます
            $("#startdate").datepicker({
          //defaultDateに日付の2022/7/15を指定 
          //引数の月を指定するときは実際の月より-1
           defaultDate: new Date(2022,6,15)
        });
      });
</script>

実行結果
カレンダーの初期日付を「2022/7/15」に設定します。引数の月を指定するときは実際の月より-1します。