0

我目前正在使用 Phonegap 和 jQuery Mobile 构建一个 iOS 应用程序,并且我正在使用 HTML5 输入类型日期元素,以便用户输入他们的生日。这对于使用 Phonegap 应用程序来说是完全有意义的,因为这会调用手机的本机日期选择器 - 太棒了!

但是,当使用桌面浏览器测试我的应用程序时(我使用的是 Firefox 16),没有显示日期选择器,这显然是因为 Firefox 尚未实现这一点。这很酷,除了我可以在该字段中输入我想要的任何内容 - 任何我想要的格式。

规范说它应该使用这种yyyy-mm-dd格式,而我的 iOS 设备就是这样做的。但是,如果我输入 eg 06-09-94,当我尝试将它转换为 JavaScript 日期对象时,它不会很好地发挥作用。

这是我的测试:

// Value is set to 1994-09-06
console.log(new Date($("input[type=date]")[0].value));
// > Date object representing September 6, 1994

// Value is set to 06-09-1994
console.log(new Date($("input[type=date]")[0].value));
// > Invalid date

我在某处读过(至少对于 chrome),所有“有效”日期格式都将表示为yyyy-mm-dd,但这并没有发生。http://updates.html5rocks.com/2012/08/Quick-FAQs-on-input-type-date-in-Google-Chrome

输入值返回什么样的格式?

input.value 始终以 yyyy-mm-dd 的形式返回,无论呈现格式如何。

所以,正如标题所示:我为什么要<input type="date">在基于非移动设备的 Web 应用程序中使用?

4

3 回答 3

2

您可能希望使用 HTML 5 表单元素,因为希望有一天所有主要浏览器都支持它们。正如您所注意到的,日期选择器等提供了非常棒的开箱即用功能,否则必须手动编码。

但是,在您无法控制用户使用的浏览器的环境中,您不希望让它们独立存在。

目前处理此问题的建议方法是检查浏览器是否支持所需的表单字段,如果不支持,请使用 jQuery UI 元素之类的替代方法。快速搜索教程:http ://www.javascriptkit.com/javatutors/createelementcheck2.shtml

我认为,一些 js 框架在内部处理这样的检查,至少对于 dojo,我知道他们尝试使用尽可能多的本机浏览器功能 - 但我不确定它是如何使用 datepickers 处理的。

我不得不说,我很惊讶 Firefox 还没有实现这一点,Chrome 和 Opera 似乎处于领先地位......

于 2012-10-30T09:24:59.553 回答
0

Since not all browsers still support all HTML5 features you can't see all it's benefits right away.
The <input type=date> tag is one of those features, if you run the code in the Chrome browser it will open date picker, when you can choose the date by clicking on the arrow button. This feature is missing though on Safari browser. Just wait for updates of browsers.

于 2012-10-30T09:15:59.607 回答
0

Date在尝试将其转换为对象之前,请检查该值是否采用适当的日期格式。

如果不是,则改为向用户显示错误消息(例如,通过添加 a<label><input>使用alert)。

于 2012-10-30T09:18:23.720 回答