强制使用数字键盘但允许使用标点符号:HTML5,移动版Safari

时间:2012-09-24 22:51:36

标签: html5 mobile-safari

我正在构建一个HTML页面,以便在移动Safari [和其他平台]中查看。该页面允许用户指定几个开始和结束时间。他们必须输入至少两次,可能更多,这取决于他们的情况。

我希望用户能够使用数字-SHIFT模式键盘输入数字和标点符号的时间,即用户将看到如下字段:

form fields

当他们专注于该领域时,他们将获得数字-SHIFT键盘:

enter image description here

无效:

<input type="time">(以及相关的日期时间类型)不是一个选项。从HCI的角度来看,滚轮是不可接受的,特别是对于重复的输入。

<input type="number">首先做正确的事。它以数字 - 移位模式触发键盘,即数字&amp;标点符号部分默认可见。但是当您退出该字段时,移动版Safari会删除标点符号(即冒号)。我尝试使用novalidate关闭表单中的验证,但这不起作用。

<input type="text" pattern="[0-9]*">触发电话键盘,无法输入冒号字符。

我可能只需要在PATTERN属性中使用不同的RegExp,但我尝试过的每一个都会触发正常的alpha键盘,用户必须按一个键才能进入数字-SHIFT键盘。

有谁可以告诉我如何在不触发用户输入的严格验证规则的情况下强制键盘进入数字SHIFT显示?

1 个答案:

答案 0 :(得分:1)

看看jQuery Mobile DateBox。 here。你可能想在这里重新考虑文本输入。也许你想和挑选者一起去。 Sencha Touch还有一个DatePicker。我写了一个实现timepicker对象的扩展。如果你需要我,我会把它扔到GitHub上。