【问题标题】:HTML 5 form validation for input datetime-local输入 datetime-local 的 HTML 5 表单验证
【发布时间】:2016-01-07 02:45:14
【问题描述】:

我正在尝试使用 HTML 5 进行表单验证,如 developer.mozilla.org Data form validation (developer.mozilla.org) 中所述。我正在使用 Chrome 浏览器对其进行测试。两个问题。

  1. 当我的输入类型为datetime-local 时,我无法通过checkValidity() 使表单通过。 datetime-local 的输入格式非常严格(Chrome 强制它采用某种格式),但它就是没有通过。为什么?
  2. datetime-local 字段不应是必填字段。当用户没有指定输入时如何让它通过?

【问题讨论】:

  • 请在jsbin.comjsfiddle.net中显示您的代码
  • 无法复制问题,请在问题本身中添加一些代码。我最接近复制该问题的方法是仅填写部分字段,将一半字段留空(但验证错误是因为该字段不完整,而不是因为它是必需的)
  • 我实际上在使用 JQuery 手机,我不知道这是否与它有关。但是好的,我会再试一次并在网站上放一些代码,看看我以后是否可以复制它。谢谢。

标签: javascript html validation


【解决方案1】:

我在 chrome 46 和 chrome 46 beta 中遇到了这个问题,其中 "datetime" 字段 是必填字段(仅限用户输入格式 YYYY-MM-DDThh:mm:ssTZD PTDHMS 有两个选项,有关值格式,请参阅W3C,有关兼容性问题,请参阅MDN。)

所以我没有使用

<input type="datetime" />

或:

<input type="datetime-local" />

我用过:

<input type="text" />

Date Js 解析用户输入的日期/时间

userInput = userInput || 'Thu, 1 July 2004 22:30:00';
Date.parse(userInput );

但您可以完全跳过 Date.js 并使用本机 JavaScript,如下所示:Source (MDN)

var today = new Date();
var birthday = new Date('December 17, 1995 03:24:00');
var birthday = new Date('1995-12-17T03:24:00');
var birthday = new Date(1995, 11, 17);
var birthday = new Date(1995, 11, 17, 3, 24, 0);
var unixTimestamp = Date.now(); // in milliseconds

另外请注意,Internet Explorer 或 Firefox 不支持带有type="datetime-local"&lt;input&gt; 元素(请参阅W3C),但您可以试试这个:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
<head>
<body>
<script>
  var input = document.createElement("input");
  input.setAttribute("type", "datetime-local");
  document.getElementsByTagName("body").appendChild(input);
</script>
</body>
</html>

【讨论】:

  • Huggie,我的回答对你有帮助吗?你介意分享一下你是否以及如何解决这个问题吗?
猜你喜欢
  • 2016-07-27
  • 2016-10-12
  • 2014-12-08
  • 1970-01-01
  • 1970-01-01
  • 2020-12-23
  • 1970-01-01
  • 2023-03-03
  • 2018-03-11
相关资源
最近更新 更多