如何禁用日期选择器中的未来日期？

Question

我为此使用了以下代码，但它不起作用。请帮我做一下。

$(document).ready(function () {

        $('.datepicker').datepicker({
            format: 'mm-dd-yyyy',
            autoclose:true,
            endDate: "today",

        }).on('changeDate', function (ev) {
                $(this).datepicker('hide');
            });


        $('.datepicker').keyup(function () {
            if (this.value.match(/[^0-9]/g)) {
                this.value = this.value.replace(/[^0-9^-]/g, '');
            }
        });
    });

Answer 1

你可以这样做：Datepicker 有一个选项 maxDate

$(document).ready(function () {
        var today = new Date();
        $('.datepicker').datepicker({
            format: 'mm-dd-yyyy',
            autoclose:true,
            endDate: "today",
            maxDate: today
        }).on('changeDate', function (ev) {
                $(this).datepicker('hide');
            });


        $('.datepicker').keyup(function () {
            if (this.value.match(/[^0-9]/g)) {
                this.value = this.value.replace(/[^0-9^-]/g, '');
            }
        });
    });

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.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>

<p>Select Date: <input type="text" class="datepicker"></p>

Answer 2

使用 maxDate:'0' 你可以做到这一点。

Working fiddle

$("#datepicker").datepicker({
  dateFormat: 'yy-mm-dd ',
  maxDate:'0'
});

Answer 3

如果您想从今天开始禁用未来日期，请使用 today.getFullYear() - 10 以禁用 10 年前，这意味着从 2008 年开始禁用。

<script>
 $(document).ready(function(){
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth()+1; //January is 0!
var yyyy = today.getFullYear()-10; // change according to year 0 for current
var today1 = mm + '/' + dd + '/' + yyyy;
$("#birthday").datepicker({
     endDate:today1,
    });
});
</script>

Answer 4

$(document).ready(function () {
        var today = new Date();
        $('.datepicker').datepicker({
            format: 'mm-dd-yyyy',
            autoclose:true,
            endDate: "today",
            maxDate: today
        }).on('changeDate', function (ev) {
                $(this).datepicker('hide');
            });


        $('.datepicker').keyup(function () {
            if (this.value.match(/[^0-9]/g)) {
                this.value = this.value.replace(/[^0-9^-]/g, '');
            }
        });
    });

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.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>

<p>Select Date: <input type="text" class="datepicker"></p>

Answer 5

只需这样做即可：它将从今天起禁用。

$("#datepicker").datepicker({
        changeMonth: true,
        changeYear: true,
        maxDate: "-1d",
        minDate: "-100Y",
        yearRange: "-100:-0"
    });

Answer 6

如果您正在使用 bootstrap-4 date-picker 您可以在输入标签中添加此属性 "data-date-end-date" => "0d"i

Answer 7

var DateIssue = $("#BodyContentPlaceHolder_dat_xxxx_xxxx_True");
              var DateOpts = {
              showButtonPanel: true,
              timepicker:false,
              dateFormat: "yy-mm-dd",
              buttonText: "" ,
              changeMonth: true,
              changeYear: true,
              yearRange: "-100:+50",
              beforeShow: beforeShowDatePicker
};
    DateOpts = {
    maxDate: new Date(),
    showButtonPanel: true,
    timepicker:false,
    dateFormat: "yy-mm-dd",
    buttonText: "",
    changeMonth: true,
    changeYear: true,
    yearRange: "-100:+50",
    beforeShow: beforeShowDatePicker
};
  $(DateIssue).datetimepicker('destroy');
  $(DateIssue).datepicker(DateOpts)

如何禁用日期选择器中的未来日期？

How to disable future dates in datepicker?

javascript

jquery

visual-studio

jquery-ui-datepicker

twitter-bootstrap