如何将期权日期设置为昨天今天和Tomarrow

Question

我正在尝试将选项设置为昨天，今天，明天的日期，我正在尝试实现以下代码它的工作，但它没有显示昨天的日期，我希望选择今天的日期以及它应该显示昨天的日期和明天的日期.. 如何实现这一点？ 任何帮助将不胜感激。提前谢谢..

<select id= "date-range" class="form-control" name="date">
   <option value="yesterday">15th June 2019 (Yesterday) </option>
   <option selected value="today">16th June 2019 (Today) </option>
   <option value="tomorrow">17th June 2019 (Tomorrow) </option>
 </select>

jquery

<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var dateRange = document.getElementById('date-range'),
monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", 
"Sep", "Oct", "Nov", "Dec"];
for(var day = 0; day < 3; day++) {
  var date = new Date();
  date.setDate(date.getDate() + day);
  dateRange.options[dateRange.options.length] = new 
Option([date.getDate(), monthNames[date.getMonth()], 
date.getFullYear()].join(' '), date.toISOString());
}
});
</script>

Answer 1

您正在使用 for 循环中的 day 变量将其添加到今天的日期。由于它从 0 开始，它永远不会得到昨天的日期。改为从 -1 开始。

要使选项自动选中，您可以使用 HTMLOptionElement 的默认选定和选定参数，并将其设置为 true。

最后，要找出用户选择了什么，您需要将更改事件侦听器附加到 select 元素。

var dateRange = document.getElementById('date-range'),
  monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug",
    "Sep", "Oct", "Nov", "Dec"
  ];
var days = ["yesterday", "today", "tomorrow"];
for (var day = -1; day < 2; day++) {
  var date = new Date();
  date.setDate(date.getDate() + day);
    var dateAsString = [date.getDate(), monthNames[date.getMonth()],
    date.getFullYear()
  ].join(' ');
  if (day == 0) {
    dateRange.options[dateRange.options.length] = new
    Option(dateAsString, dateAsString + " (" + days[day + 1] + ")", true, true);
  } else {
    dateRange.options[dateRange.options.length] = new
    Option(dateAsString, dateAsString + " (" + days[day + 1] + ")");
  }
}
function handleSelected(e) {
  console.log(e.target[e.target.selectedIndex].value + " selected");
}
dateRange.addEventListener("change", handleSelected);

<select id="date-range" class="form-control" name="date">
</select>

Answer 2

    You can get as below,
    1) Yesterday Date
          let now = new Date();
          var defaultDate = now - 1000 * 60 * 60 * 24 * 1;
          defaultDate = new Date(defaultDate);
    2)  Today's date
          let now = new Date();
          var defaultDate = now ;
          defaultDate = new Date(defaultDate);
    3) Tomorrow's date
          let now = new Date();
          var defaultDate = now + 1000 * 60 * 60 * 24 * 1;
          defaultDate = new Date(defaultDate);
    Then you can just format it as per your required one.
    Hope this will help you