时间戳

首页 > 解决方案 > 我只需要在开始日期选择的日期选择器中显示未来一个月的日期

javascript - 我只需要在开始日期选择的日期选择器中显示未来一个月的日期

问题描述

enter code here


$("#StartDate").datepicker({
    dateFormat: 'dd/mm/yy',
    onSelect: function (selectedDate) {
        if (this.id == 'StartDate') {
            //console.log(selectedDate);//2014-12-30
            var arr = selectedDate.split("/");
            var date = new Date(arr[2]+"-"+arr[1]+"-"+arr[0]);
            var d = date.getDate();
            var m = date.getMonth();
            var y = date.getFullYear();
            var minDate = new Date(y, m, d + 1);
            $("#EndDate").datepicker('setDate', minDate);

        }
    }
});
$("#EndDate").datepicker({dateFormat: 'dd/mm/yy'});
<input id="StartDate" type="text"  name="StartDate">
<input id="EndDate" class="datepicker" type="text"  name="EndDate">

给出的任何必需的插件都是可观的。

这里的要求就像我有两个输入字段，一个用于开始日期，另一个用于结束日期，例如，如果选择开始日期为 21-05-2020 并且自动结束日期输入字段应获取未来一个月的日期为2020 年 6 月 21 日。最后输出应该像开始日期：21-05-2020 到结束日期：21-06-2020。

标签： javascriptjquery

解决方案

您只需要添加minDate和maxDate属性，如下所示（单击下方的运行代码片段按钮以进行现场演示）：

$(function() {
  $("#datepicker").datepicker({
    minDate: 0, // ban dates in the past
    maxDate: "+1M" // allow only 1 month in the future
  });
});
<link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<body>
  <p>My cool date Date: <input type="text" id="datepicker"></p>
</body>

推荐阅读