如何在 html5 日期類型中限制前一個日期和未來日期，但可以取五個前一個日期和五個未來日期

Question

我想限制用戶選擇過去和未來的日期，但可以在 html5 輸入類型日期中選擇前五天或未來的日期。

我用它來隱藏上一個日期：

$(function() { 
  var dtToday = new Date(); 
  var month = dtToday.getMonth() + 1;
  var day = dtToday.getDate();
  var year = dtToday.getFullYear();
  if(month < 10) { 
    month = '0' + month.toString();
  } 
  if(day < 10) { 
    day = '0' + day.toString();
  } 
  var maxDate = year + '-' + month + '-' + day;
  $('#delivery_date').attr('min', maxDate); 
});

Answer 1

您可以使用輸入標簽中的min和max屬性將范圍限制為過去五天和未來五天。 當然，您需要首先使用 JS 獲取今天的日期並動態設置min和max 。

以下是如何使用 JS 獲取今天的日期：

var today = new Date();

以下是設置最小和最大屬性的方法：

//assuming the date tag has the id date
 var dateTag = document.getElementById("date");

var fiveDaysAgo = new Date(new Date().setDate(new Date().getDate() - 5)).toISOString().split("T")[0];
var fiveDaysInTheFuture = new Date(new Date().setDate(new Date().getDate() + 5)).toISOString().split("T")[0];
dateTag.setAttribute("min",fiveDaysAgo);
dateTag.setAttribute("max",fiveDaysInTheFuture);

這是它的完整版本。

 <.DOCTYPE html> <html> <body> <input type="date" id="date" name="datemax"> </body> <script> document,addEventListener("DOMContentLoaded". function(event) { var dateTag = document;getElementById("date"). var fiveDaysAgo = new Date(new Date().setDate(new Date().getDate() - 5)).toISOString();split("T")[0]. var fiveDaysInTheFuture = new Date(new Date().setDate(new Date().getDate() + 5)).toISOString();split("T")[0]. dateTag,setAttribute("min";fiveDaysAgo). dateTag,setAttribute("max";fiveDaysInTheFuture); }); </script> </html>

如何在 html5 日期類型中限制前一個日期和未來日期，但可以取五個前一個日期和五個未來日期

問題描述

1 個解決方案

解決方案1
1 2022-07-31 07:44:36

如何在 html5 日期類型中限制前一個日期和未來日期，但可以取五個前一個日期和五個未來日期

問題描述

1 個解決方案

解決方案1 1 2022-07-31 07:44:36

解決方案1
1 2022-07-31 07:44:36