<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1/i18n/jquery.ui.datepicker-ja.min.js"></script>

    日付
    <input type="text" id="calendar">

$(function() {
  $('#calendar').datepicker({
    changeYear: true,    // 年を表示
    changeMonth: true,   // 月を選択
    minDate: '1d', // 本日以前は選択不可
    maxDate: '+1y +6m',  // 1年半後まで選択可
  });
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.