Javascript 如何在 html5 输入类型 Date 中限制过去的日期

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/43274559/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 01:48:15  来源:igfitidea点击:

How do I restrict past dates in html5 input type Date

javascripthtml

提问by user7397787

I am trying to restrict past dates in input type="date".I can able to restrict future dates,But I don't have idea about restricting past dates.

我试图限制过去的日期。input type="date"我可以限制未来的日期,但我不知道限制过去的日期。

$(function(){
    var dtToday = new Date();
    
    var month = dtToday.getMonth() + 1;
    var day = dtToday.getDate();
    var year = dtToday.getFullYear();
    if(month < 10)
        month = '0' + month.toString();
    if(day < 10)
        day = '0' + day.toString();
    
    var minDate= year + '-' + month + '-' + day;
    
    $('#txtDate').attr('min', minDate);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="date" id="txtDate" />

Any suggestion?

有什么建议吗?

回答by Dhiraj

You can try this

你可以试试这个

 var maxDate = year + '-' + month + '-' + day;
    alert(maxDate);
    $('#txtDate').attr('min', maxDate);

$(function(){
    var dtToday = new Date();
    
    var month = dtToday.getMonth() + 1;
    var day = dtToday.getDate();
    var year = dtToday.getFullYear();
    if(month < 10)
        month = '0' + month.toString();
    if(day < 10)
        day = '0' + day.toString();
    
    var maxDate = year + '-' + month + '-' + day;
    alert(maxDate);
    $('#txtDate').attr('min', maxDate);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="date" id="txtDate" />

回答by umishra

Hope below code will help you. It is normal HTML5 code:

希望下面的代码能帮到你。这是正常的 HTML5 代码:

/*Enter a date before 1980-01-01:*/
<input type="date" name="bday" max="1979-12-31">

/*Enter a date after 2000-01-01:*/
<input type="date" name="bday" min="2000-01-02">

see working link

见工作链接

回答by Wajid khan

In HTML:

在 HTML 中:

<input type="date" id="ExpiryDate" class="form-control" min="9/10/2018"/>

Using Jquery new version:

使用 Jquery 新版本:

function SetMinDate() {
    var now = new Date();

    var day = ("0" + now.getDate()).slice(-2);
    var month = ("0" + (now.getMonth() + 1)).slice(-2);

    var today = now.getFullYear() + "-" + (month) + "-" + (day);

    $('#ExpiryDate').val(today);
    $('#ExpiryDate').attr('min', today); }

回答by Painguin

Here is a PHP solution that gets today's date and sets it as the minimum.

这是一个 PHP 解决方案,它获取今天的日期并将其设置为最小值。

<input type="date" id="txtDate" min="<?php echo date("Y-m-d"); ?>">

This will put it in the correct double-digit format for the day and month. https://www.php.net/manual/en/function.date.php

这将把它放在正确的日期和月份的两位数格式中。https://www.php.net/manual/en/function.date.php

回答by Vikash Kumar Jha

<input type="date" id="date"> 
var date = new Date().toISOString().slice(0,10);

//To restrict past date

$('#date').attr('min', date);

//To restrict future date

$('#date').attr('max', date);

回答by Shah Xahur

  $(function() {
          $(document).ready(function () {
            var todaysDate = new Date();
            var year = todaysDate.getFullYear();
            var month = ("0" + (todaysDate.getMonth() + 1)).slice(-2);
            var day = ("0" + todaysDate.getDate()).slice(-2);
            var maxDate = (year +"-"+ month +"-"+ day);
            $('.class_of_input_field').attr('min',maxDate);
          });
        });``