Jquery 不允许在日期选择器上选择以前的日期

Question

所以我有一个日期选择器，它每月只允许选择 2 个日期，第 1 个和第 15 个。 问题是它仍然允许选择以前的日期。 例如，如果它是 10 月 1 日，则不应选择所有以前的日期。 我怎样才能使它不能选择所有以前的日期？

<link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<input id="side-datepicker">

$('#side-datepicker').datepicker({
     beforeShowDay: function (date) {
    //getDate() returns the day (0-31)
     if (date.getDate() == 1 || date.getDate() == 15) {
     return [true, ''];
    }
    return [false, ''];
    },


    });

Answer 1

 $('#side-datepicker').datepicker({ beforeShowDay: function (date) { let today = new Date('2019-10-24'); //if you want the current date to be selectable uncomment the following line //today.setDate(today.getDate() -1); if (date > today && (date.getDate() == 1 || date.getDate() == 15)) { return [true, '']; } return [false, '']; } });

 <link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" /> <script src="https://code.jquery.com/jquery-3.1.0.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <input id="side-datepicker">

Answer 2

您将要使用最小日期选项来强制日期选择器的底部，如下所示：

 var currentTime = new Date() var minDate = new Date(currentTime.getFullYear(), currentTime.getMonth(), +1); //first day of current month $('#side-datepicker').datepicker({ minDate: minDate, beforeShowDay: function (date) { //getDate() returns the day (0-31) if (date.getDate() == 1 || date.getDate() == 15) { return [true, '']; } return [false, '']; }, });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" /> <script src="https://code.jquery.com/jquery-3.1.0.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <input id="side-datepicker">

如果您想将其限制为当前月份和尚未过去的日期。 示例仅允许 1 日和 15 日，但今天是 10 月 25 日（1 日和 15 日之后），因此第一个可供选择的日期将是 11 月 1 日，然后您将修改您的最小日期，如下所示：

var minDate = new Date(currentTime.getFullYear(), currentTime.getMonth(), currentTime.getDate()); //current date

前任：

 var currentTime = new Date() var minDate = new Date(currentTime.getFullYear(), currentTime.getMonth(), currentTime.getDate()); //current date $('#side-datepicker').datepicker({ minDate: minDate, beforeShowDay: function (date) { //getDate() returns the day (0-31) if (date.getDate() == 1 || date.getDate() == 15) { return [true, '']; } return [false, '']; }, });

 <link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" /> <script src="https://code.jquery.com/jquery-3.1.0.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <input id="side-datepicker">