<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>日期选择器</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css">
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
</head>
<body>
<input type="text" id="trainingEndDate" readonly>

</body>
<script>
    $(function() {
        $("#trainingEndDate").datepicker({
            dateFormat: "yy-mm-dd",
            minDate: 0,
            maxDate: '+1Y',
            changeMonth: true,
            numberOfMonths: 1,
            onSelect: function(dateText) {
                $(this).change();
            }
        });
    });
</script>
</html>