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

发布于 2025-01-16 15:17:33 字数 297 浏览 0 评论 0原文

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

我熟悉最大日期和最小日期,它们需要精确的 DD/MM/YY 格式设置列出的日期之间的界限。我需要类似“最大日期:今天 + 14”的内容

I have been looking around on this page (among other forums) in search of an answer for limiting a date picker to 14 days from the day a user accesses the page. Built into the date picker is an option for 'todays date' which is auto configured and sets the date option to todays DD/MM/YY so I gather this can be achieved. What I aim for is every date after 14 days from 'today' to be greyed out and not selectable. I could further develop this so that no dates prior to 'today' can also be selected, but achieving a limit of 14 days after 'today' would be great for now.

I'm familiar with max-date and min-date which require a precise DD/MM/YY format setting boundaries between the listed dates. I require something like 'max-date: today + 14'

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

与酒说心事 2025-01-23 15:17:33

我需要类似“最大日期:今天 + 14”的内容

这基本上就是您的答案,即“将 max 属性设置为 today + 14,将 min 属性设置为 today” 。在 JavaScript 中相当简单:

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

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

// Borrowed from https://stackoverflow.com/a/29774197/7290573
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" />

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

This is basically your answer, i.e. "set the max attribute to today + 14 and the min attribute to today". Fairly straightforward to do in JavaScript:

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

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

// Borrowed from https://stackoverflow.com/a/29774197/7290573
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" />

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文