Question

在我正在处理的项目中，我正在使用JQuery datepickers。我在一页上有两个日期选择器，并且我需要将第二个日期选择器初始化为比第一个日期选择器早一年（例如，如果datepicker1设置为1/1/2019，则我需要{{1 }}设置为1/1/2020）。

我下面有当前的JavaScript：

datepicker2

我不太熟悉datepicker API。如何使第二个日期选择器比第一个日期选择器早一年启动？

Answer 1

    $(document).ready(function(){
    $('#datepicker1').datepicker();
    $('#datepicker2').datepicker();
    $('#datepicker1').on('change',function(){
       $( "#datepicker2" ).datepicker( "destroy" );
      var minDate= $('#datepicker1').datepicker( "getDate" );
      minDate.setDate(minDate.getDate() + 365); 
      console.log(minDate);
     $( "#datepicker2" ).datepicker({ minDate: new Date(minDate) });   
      });
    });

<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
  <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>
  <body>
   <p>Date1: <input type="text" id="datepicker1"></p>
  <p>Date2: <input type="text" id="datepicker2"></p> 
  </body>
</html>

您可以通过将更改事件写入datepicker1来实现。为了限制日期选择，只需将minDate属性设置为datepicker2。为了检查1年的差距，我在这里增加了365天，在某些情况下，您可以寻求另一种逻辑可能是错误的。希望对您有帮助。

将第二个日期选择器设置为比第一个日期选择器晚一年

1 个答案: