禁用未来日期和当前日期答案

【问题标题】：disable the future date and the current date禁用未来日期和当前日期
【发布时间】：2016-01-04 03:52:03
【问题描述】：

Here is my Interface, and i wanted the user to input only the date of his birth这是我的代码。我想禁用“出生日期”字段的未来日期和当前日期

<div class="form-group">
                                <label class="control-label"
                                    for="personal_information.date_of_birth">Date of Birth</label>
                                <input class="form-control" 
                                    rv-value="data.personal_information.date_of_birth"
                                    name="dateOfBirth" id="dateOfBirth" data-validate="required"
                                    data-mask="yyyy-mm-dd" placeholder="Pre-formatted birth date" />
                            </div>

【问题讨论】：

从哪里禁用日期？
OK 真的不明白这个问题...以为你有多个字段如果是这样disabled 会这样做
@OldMauiMan 但你还是回答了..
这个问题很不清楚。让我猜猜：您想阻止用户输入等于或晚于今天日期的日期。如果是这种情况，请编辑您的帖子以表明这一点。 “禁用未来日期和当前日期” 真的没有意义。此外，如果您要进行这种类型的验证，您可能还应该阻止输入过去 4-5 年的日期，除非您预计会有 4 或 5 岁的访问者。
对不起。是的，我想阻止用户输入当前日期和未来日期。

标签： html validation date

【解决方案1】：

纯 HTML 或 CSS 无法做到这一点。需要 Javascript。但是，有一种快速的方法可以做到这一点，使用两个名为 jQuery 和 jQueryUI 的 JavaScript 库：

jsFiddle Demo

HTML：

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<div id="MyDIV">
  Birthday: <input id="bday" type="text" />
</div>

javascript/jQuery:

$("#bday").datepicker({
  maxDate: "-1"
});

请注意，您可以使用：

maxDate: "-20Y"

确保生日必须至少 20 岁。

如果你不确定将 javascript 代码放在哪里，你可以将它包含在你的 HTML 中，在<script> 标签之间在<head>):

<head>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

    <script type="text/javascript">
        $(document).ready(function(){
            $("#bday").datepicker({
              maxDate: "-1"
            });
        });
    </script>
</head>
<body>

<div id="MyDIV">
  Birthday: <input id="bday" type="text" />
</div>

</body>

【讨论】：

老兄。是否可以只输入类型而不是弹出日历？