javascript - 如何在选择 future 日期时禁用 html 日期输入类型？

Question

我有一个代码，就在去年，它仍然有效。它的作用是禁止用户选择 future 的日期。现在是一月，它似乎不起作用。我不懂为什么。请帮我解决这个问题。您的帮助将不胜感激。

这是输入:

<input id="reqDate" class="form-control col-md-7 col-xs-12" name="reqDate" required="required" type="date">

Javascript:

<script type="text/javascript">
          var input = document.getElementById("reqDate");
          var today = new Date();
          var day = today.getDate();

          // Set month to string to add leading 0
          var mon = new String(today.getMonth()+1); //January is 0!
          var yr = today.getFullYear();

            if(mon.length < 2) { mon = "0" + mon; }

            var date = new String( yr + '-' + mon + '-' + day );

          input.disabled = false; 
          input.setAttribute('max', date);
</script>

顺便说一下，我在 .php 文件中使用这段代码。

Answer 1

如您所用，原生 input[type="date"] 元素支持最大日期值:

Enter a date before 1980-01-01:
<input type="date" name="bday" max="1979-12-31">
http://www.w3schools.com/tags/att_input_max.asp

您用来设置日期的 JavaScript 不会对日期进行零填充，因此对于一月一日，您将获得日期 max="2016-01-1"。为了与您的 JavaScript 版本保持一致，请使用以下内容填充日期:

<script>
      var input = document.getElementById("reqDate");
      var today = new Date();
      var day = today.getDate();

      // Set month to string to add leading 0
      var mon = new String(today.getMonth()+1); //January is 0!
      var yr = today.getFullYear();

        if(mon.length < 2) { mon = "0" + mon; }
        if(day.length < 2) { dayn = "0" + day; }

        var date = new String( yr + '-' + mon + '-' + day );

      input.disabled = false; 
      input.setAttribute('max', date);
</script>

这是一个 PHP 脚本，为了简化您的代码，您可以使用:

<input type="date" name="bday" max="<?=date('Y-m-d')?>">

注意对 input[type="date"] 的支持因浏览器而异(参见 http://caniuse.com/#feat=input-datetime )。

您可以通过在浏览器检查器中检查元素来确认所使用的最大值采用正确支持的 RCF3339 格式。