使用HTML5日历选择器输入日期类型

Question

有没有办法不允许手动编辑日期？我的意思是我想强制用户只能使用日历选择日期。

已有：

<input type="date"   value="yyyy-mm-dd" class="input-medium search-query">

用户可以在输入表单中输入内容。我尝试过以下方式：

<input type="date"   value="yyyy-mm-dd" class="input-medium search-query" disabled>

但是它会冻结整个表单。

有什么提示吗？ 或者也许有什么快速的方法可以防止用户破坏日期格式？ (因为我使用bootstrap，所以不想使用jquery)

- JosephConrad

---

可能不太可能，但为什么要一开始就排除这种可能性呢？ - Pekka

1. 通过删除用户期望的基本UI，您正在损害自己页面的用户体验；
2. 您将使不支持“日期”输入的浏览器无法使用您的页面；
3. 进行适当的验证，而不是依赖于可以轻松绕过的客户端操作。

- Fabrício Matté

@FabrícioMatté +1 感谢您的好评。确实，验证似乎是更好的解决方案。 - JosephConrad

Answer 1

如果你准备在那里加一点JS，当用户按键时，你可以返回false：

<input type="date"   value="yyyy-mm-dd" class="input-medium search-query" onkeypress="return false">

这是一个 jsFiddle

- George

---

有没有一种方法可以显示像“一月”这样的整个月份名称？ - user2805663

onkeypress="return false" 无法阻止退格键，但 onkeydown="return false" 可以。 - raghavsood33

Answer 2

在旧版浏览器中，type=date不受支持并会降级为type=text。然后，onkeydown='return false'方法将使输入变得不可能。

- MichaelJC