移动设备的时间选择器答案

【问题标题】：Time Picker for mobile devices移动设备的时间选择器
【发布时间】：2011-04-02 11:31:28
【问题描述】：

我正在使用 HTML5、CSS3 并在我的项目中使用 jQuery。我只需要一个时间选择器 - 没有日期选择器 - 用于 iPad、Galaxy 等移动设备。它应该适用于触摸屏和非触摸屏设备。我找到了一个带滑块的，但在移动设备上失败了。

【问题讨论】：

【解决方案1】：

查看DateBox。我认为它完全符合您的需要：

【讨论】：

【解决方案2】：

我找到了另一个看起来不错的。针对不同平台也有不同的风格：mobiscroll

【讨论】：

【解决方案3】：

很高兴告诉您，不需要第三方插件即可获得时间选择器功能。

HTML5 已经有一个非常容易实现的本地时间选择器：

<label for="timePicker1">Set Time:</label>
<input type="time" name="timePicker1" id="timePicker1" value="10:00">

使用 jQuery 读取和写入值同样容易：

var time = $('#timePicker1').val(); //<- Get value
$('#timePicker1').val("09:30");     //<- Set value

set/get 的值都是格式为“hh:mm”的字符串。

它在 JQuery Mobile 1.4.2 上按预期工作。

问候。

【讨论】：

【解决方案4】：

我基于现有的 Datepicker 编写了这个 jQuery Time Picker，但仅用于时间。从未在移动设备上尝试过，但我认为它会很好用。

【讨论】：

感谢您的帮助。但是伙计们，我需要一个时间选择器，它可以显示并让用户选择最多几秒钟的时间。请告诉我您制作的控件是否也可自定义。
伙计们，我需要向用户显示从 0 到 59 的分钟和秒数。
抱歉，它没有这样做。分钟和秒级别的输入将是巨大的或复杂的。也许你需要一个定制的小键盘什么的。
嗨，是的，你是对的。我找到了一种解决方案，该解决方案指向屏蔽文本字段以仅允许时间。 stackoverflow.com/questions/2259843/jquery-masked-edit-for-time

【解决方案5】：

有趣的问题——我尝试了第一个 Jquery 日期选择器（包括时间选择器）示例：

它在我的 iPhone 上运行一次，但随后无法响应进一步的触摸事件。

然后我尝试了第二个：日历

我可以在 iPhone 上设置时间并重置它。你试过了吗？

您还可以查看 Sencha 的触摸事件并考虑其计时器。

【讨论】：

【解决方案6】：

看起来 jQuery mobile 最近更新了他们的日期和时间选择器代码。看看这里的演示（可能只能在移动设备上正常工作）： http://jquerymobile.com/test/docs/forms/textinputs/

【讨论】：

【解决方案7】：

我一直在寻找本地时间选择器，而不是定制的。发现这个在 Android 4.0+ 上运行得非常好。我还没有在 iOS 上测试过。

【讨论】：

你好，这个插件是我创建的。我想说这个插件支持Android 2.3+，而不仅仅是4.0+。您可以通过这个 Play 商店应用程序看到它的实际效果 - play.google.com/store/apps/details?id=com.bikasv.cordovaPlugin。
另外补充一点，这个插件根本不支持iOS，至少现在还不支持。