Jquery-如何设置今天无法选择的日期？

Question

我可以将今天的日期显示在入住日期，但是问题是用户仍然可以选择今天的日期之前的日期。有什么解决办法可以让我解决他的问题吗？任何建议都会有很大帮助，谢谢！

$(function () {
        $("#chkI").datepicker({
            dateFormat: "yy-mm-dd", showAnim: "slideDown", 
            onClose: function (selectedDate) {
                var minDate = $(this).datepicker('getDate');
                var newMin = new Date(minDate.setDate(minDate.getDate() + 1));
                $("#chkO").datepicker("option", "minDate", newMin);
            }
        });
        var currentDate = new Date();
        $("#chkI").datepicker("setDate", currentDate);
        $("#chkO").datepicker({ dateFormat: "yy-mm-dd", showAnim: "slideDown",
            onClose: function (selectedDate) {
                var maxDate = $(this).datepicker('getDate');
                var newMax = new Date(maxDate.setDate(maxDate.getDate() - 1));
                $("#chkI").datepicker("option", "maxDate", newMax);
            }
        });
    });

Answer 1

这是我如何禁用今天之前的日期：

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

例如jsfiddle

Answer 2

您只需要设置minDate，而不必为相同的输入再次初始化datepicker

$(function () {
            $("#chkI").datepicker({
                minDate: new Date(), // start date should be today's date
                dateFormat: "yy-mm-dd", showAnim: "slideDown", 
                onClose: function (selectedDate) {
                    var minDate = $(this).datepicker('getDate');
                    var newMin = new Date(minDate.setDate(minDate.getDate() + 1));
                    $("#chkO").datepicker("option", "minDate", newMin);
                }
            }).datepicker("setDate", new Date()); // select today's date by default
            //var currentDate = new Date();
            //$("#chkI").datepicker("setDate", currentDate);
            $("#chkO").datepicker({ dateFormat: "yy-mm-dd", showAnim: "slideDown",
                onClose: function (selectedDate) {
                    var maxDate = $(this).datepicker('getDate');
                    var newMax = new Date(maxDate.setDate(maxDate.getDate() - 1));
                    $("#chkI").datepicker("option", "maxDate", newMax);
                }
            });
        });

 <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<input type="text" id="chkI">
<input type="text" id="chk0">