时间戳

首页 > 解决方案 > 如何在 HTML 时间表单中禁用/灰显特定时间

javascript - 如何在 HTML 时间表单中禁用/灰显特定时间

问题描述

我有一个预订表格，我想灰显/禁用客户已经选择的那些时间/时间。

以便下一个人预订不同的时间。我不太确定如何实现这一目标。我看过禁用时间范围示例，但我不知道如何将其链接到此表单并使其工作。我还没有找到任何其他有用的资源来解决这个问题。

<div class="form-group">
    <label for="time">Time</label>
    <input type="time" name="time" class="form-control" required>
</div>

标签： javascripthtmltime

解决方案

不幸的是，这不是<input type="time">API 的一部分。您可以设置单个min=和max=每个时间元素，但这或多或少是这样。

但是，您可以利用setCustomValidity()API添加一条错误消息，说明如果用户尝试，选择的特定时间已经保留。

（但是，不要忘记在服务器端验证用户的输入。:)）

推荐阅读