添加天数到html表单日期选择器

时间:2016-06-21 21:31:06

标签: javascript html datepicker

那我在这里做错了什么? 我有一个带有2个日期html datepickers的表单,1表示当他们到达的地方,日期是今天的最小值,另一个是我试图这样做,他们只能预订最少1周。

如果你们知道怎么做更容易,请告诉我这对我有很大的帮助!

<script src="jquery.js"></script>
<!-- <script src="booking.js"></script> -->

<script type="text/javascript">
        var today = new Date().toISOString().split('T')[0];
document.getElementsByName("a_Date")[0].setAttribute('min', today);

    var vDate = (today).getDate(today);
    console.log(vDate);
    console.log(today);


        document.getElementsByName("v_Date")[0].setAttribute('min', vDate); 
</script>

1 个答案:

答案 0 :(得分:0)

好吧,如果我清楚地了解你想在这里实现的目标,你必须限制两个日期之间的天数。在这种情况下,1周。 除此之外还有一些要求,例如,您希望从今天开始将第一个datepicker元素作为最小日期。

我给你做了这个例子,然后你可以适合你的元素。

<html lang="en">
  <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>
      $(function() {
        $( "#from" ).datepicker({
          minDate: 0, 
          onClose: function( selectedDate ) {
            var newDate = new Date(selectedDate);
            newDate.setDate(newDate.getDate() + 7)
            $( "#to" ).datepicker( "option", "minDate", newDate);
          }
        });
        $( "#to" ).datepicker();
    
      });
    </script>
  </head>
  <body> 
    <label for="from">From</label>
    <input type="text" id="from" name="from">
    <label for="to">to</label>
    <input type="text" id="to" name="to"> 
  </body>
</html>