限制日期选择器(从今天开始)- HTML

Limiting Date Picker (from today) - HTML

我一直在这个页面(以及其他论坛)上四处寻找答案,以寻找将日期选择器限制为从用户访问该页面之日起 14 天的答案。内置于日期选择器的是 'todays date' 的一个选项,它是自动配置的,并将日期选项设置为今天 DD/MM/YY,所以我认为这是可以实现的。我的目标是 从 'today' 起 14 天后的每个日期都显示为灰色并且不可选择 。我可以进一步开发它,以便也可以选择 'today' 之前的日期,但现在限制 'today' 之后的 14 天会很好。

我熟悉最大日期和最小日期,它们需要精确的 DD/MM/YY 格式设置所列日期之间的界限。我需要像 'max-date: today + 14'

这样的东西

I require something like 'max-date: today + 14'

这基本上就是您的答案,即“将最大属性设置为 today + 14,将最小属性设置为 today”。在 JavaScript:

中非常简单

const datePicker = document.getElementById("date-picker");

datePicker.min = getDate();
datePicker.max = getDate(14);

// Borrowed from 
function getDate(days) {
    let date;

    if (days !== undefined) {
        date = new Date(Date.now() + days * 24 * 60 * 60 * 1000);
    } else {
        date = new Date();
    }

    const offset = date.getTimezoneOffset();

    date = new Date(date.getTime() - (offset*60*1000));

    return date.toISOString().split("T")[0];
}
<input id="date-picker" type="date" autocomplete="off" />