HTML 输入字段:自动显示数字输入法

发布于 2024-11-29 18:43:12 字数 263 浏览 2 评论 0原文

我有一个网络应用程序,其布局设置为与移动设备配合使用。但是,我在表单中的大多数输入字段都是数字。

每次我使用 Android 手机访问表单并单击其中一个输入字段以创建输入字段时,qwerty 就会出现,我必须切换到数字输入法并输入一些数字。那很不方便。

是否有 HTML 属性或某物。类似的,会让 Android(和 iPhone)默认显示数字键盘?

再次强调,这是一个 Rails 应用程序,而不是本机智能手机应用程序。

任何帮助表示赞赏,谢谢。

I have a web-app with a layout that is set up to work with mobile devices. However, most of my input fields in forms are numeric.

Every time I access a form with my Android phone and click into one of the input fields to make an input field, the qwerty comes up and I have to switch to numeric input method and enter some numbers. That's inconvenient.

Is there a HTML-property or sth. similar that will make Android (and iPhone) display the numeric keypad as a default?

Again, this is a Rails app and not a native smartphone app.

Any help appreciated, thanks.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

私野 2024-12-06 18:43:12

在 HTML 5 中,type='number' 表示字段只需要数字,而现代浏览器只允许数字输入。

<input type='number' value='123' />

编辑:

让我稍微修改一下,因为从评论来看,原始答案对大多数人来说有点浅薄。

基本上,您有三种选择:type='number'type='range'type='tel'他们都不能保证工作。结果因浏览器和键盘而异。

例如,我的 Android Opera Mobile 不需要数字键盘,但它确实像桌面版本一样向 number 字段添加了一个旋转框。与 step='0.1' 配合使用的旋转框,但在当前实现中并不真正适合移动使用。

在我的 Android Firefox 5 上,number 也不会使用我的库存输入生成数字键盘 - 这是我开始怀疑我的库存键盘是否支持数字的地方 - 但 tel 可以!并带有点!以及 ABC DEF GHI for 1 2 3,它给出了它。
但是 type='tel' 还不是 HTML5 标准,并且您无法从浏览器获得验证。(2013-08 更新:tel 已成为 HTML5 标准!我不确定什么时候...)

至于 range,规范期望浏览器提供滑块而不是输入框。有些会,有些不会,我上次检查时,iPhone Safari 属于后者。如果您不介意不同的演示,那么它可能是更好的选择。

是的,我知道。欢迎来到 HTML 5 开发。情况正在好转;我希望你不会因为我们现在所处的风暴而退缩。

In HTML 5, type='number' says that a field expects only numbers and modern browsers would allow only numberic inputs.

<input type='number' value='123' />

EDIT:

Let me amend a bit, since judging from the comments the original answer is a bit shallow for most.

Basically, you have three choices: type='number', type='range', and type='tel'. None of them are guarenteed to work. The result varies by both browser and keyboard.

For example, my Android Opera Mobile doesn't ask for a numeric keyboard, but it does add a spinbox to the number field like the desktop version. A spinbox that works with step='0.1', but not really suitable for mobile use with current implementation.

On my Android Firefox 5, number doesn't yield numeric keyboard with my stock input either - this is where I start to doubt whether my stock keyboard support numeric - but tel does! And with dot! As well as ABC DEF GHI for 1 2 3 which gives it out.
However type='tel' is not HTML5 standard (yet), and you don't get validation from browser. (Update 2013-08: tel has been made a HTML5 standard! I'm not sure when...)

As for range, the specs expects that browser provide slider instead of input box. Some do, some don't, and iPhone Safari is in the later camp last I checked. If you don't mind the varying presentation it can be a better choice.

Yeah, I know. Welcome to HTML 5 development. Things are improving; I hope you won't be put off by the storm we are in right now.

悍妇囚夫 2024-12-06 18:43:12

我发现结合两种方法可以实现这一点。

在大多数 Android 浏览器中,设置 type="number 在大多数情况下应该可以解决问题。但是,在 iOS 中,这将调出普通键盘,但默认为数字和特殊字符页面。我更喜欢要在 iOS 中完成此操作,请使用 pattern 属性。最终的 HTML 元素将如下所示:

<input type="number" pattern="[0-9]*" value="123" />

I've found that combining 2 methods will allow this to happen.

In most Android browsers, setting type="number should do the trick most of the time. However, in iOS this will bring up the normal keyboard, but defaulted to the number and special character page. I prefer the phone dialer type input. To accomplish this in iOS use the pattern attribute. The final HTML element will look like:

<input type="number" pattern="[0-9]*" value="123" />
你的笑 2024-12-06 18:43:12

type='tel' / HTML 增强 ?

如果 type='tel' 不是 html5 的一部分,那么谁组织该属性的确切行为?

希望 tel 属性应该接受两种样式:

  1. 国家格式电话号码:

这是来自芬兰的示例:

0401234567

  1. 国际格式电话号码:

这是来自芬兰的相同示例,但采用正确的国际格式:

+358401234567

因此,在“tel”中规则应如下:

第一个字符可以是数字或特殊字符“+”。

任何其他字符都必须是数字。

这种格式适用于任何国家。

这是澳大利亚的另一个例子:

+61418765432(国际格式)

0418765432(国家格式的相同电话号码)

北美人似乎使用自己的格式,例如(212)1234567。

但是,这样做的问题是,它不兼容与其他所有国家。

还应该注意的是,有效电话号码的长度可能会有所不同,无论是在国家之间,甚至在同一国家内。因此,“tel”不应强制任何长度限制,至少不应过于严格。

我不知道国际格式的最大合法电话号码长度是多少。

然而,在芬兰,国家部分将其指定为 12 位有效数字。

因此,以下是芬兰可以使用的最长有效号码的示例:

国际格式的0501234567890

+358501234567890。

在 GSM 移动电话中,如果您使用电话号码作为 AT 命令的一部分,您可以(在某些命令中)指定号码的类型(格式)。但如果您不这样做,

则默认情况下假定号码采用正确的国际格式(如果号码以“+”字符开头),

否则假定号码采用国家格式,这

意味着以数字开头的号码,将转到手机当前所在的国家/地区,除非该号码以手机当前所在国家/地区有效的已知国际前缀开头。

那么,“电话”在国家/地区使用是否安全除美国以外,还是迫使数字向北美国格式,除了美国以外的每个国家都是错误的?

type='tel' / HTML enhancement ?

If type='tel' is not part of html5, then who organizes the excact behavior of that attribute?

Hopefully, the tel attribute should accept two styles:

  1. National format phone number:

Here is an example from Finland:

0401234567

  1. International format phone number:

Here is the same example from Finland, but in proper international format:

+358401234567

So, in "tel" the rules should be as follows:

The first character may either be a digit or the special character "+".

Any other characters must be digits.

This format will serve for any country.

Here is another example from Australia:

+61418765432 (International format)

0418765432 (The same phone number in national format)

North americans seem to use their own format such as (212) 1234567.

But, the problem with this is, that it is incompatible with every other country.

Also it should be noted, that the length of a valid phone number may vary, both between countries and even within the same country. So, the "tel" should not force any length restriction, at least not any that is too strict.

I have no idea, what is the maximum legal phone number length in international format.

However, in Finland it is specified as 12 significant digits in the national part.

So, here is an example of the longest valid number that could be used in Finland:

0501234567890

or

+358501234567890 in international format.

In GSM mobile phones, if you use phone number as part of an AT -command, you may (in some commands) specify the type (format) of the number. But if you do not,

the default is to assume the number is in proper international format IF the number starts with the "+" character,

otherwise it is assumed to be in the national format,

meaning that a number which starts with a digit, will go to the same country the mobile phone is currently located in, unless the number starts with a known international prefix that is in effect in the country the mobile phone is currently located in.

So, is the "tel" safe to use in countries other than the USA, or does it force the number to the north american format, which is wrong for every country except for the USA ?

几度春秋 2024-12-06 18:43:12

如果你只需要显示专用键盘,没有相应的语义、验证等,你可以使用 inputmode attr,例如:

<input type="text" value="+1234567890" inputmode="tel" />
<input type="text" value="123.45" inputmode="decimal" />

If you only need to display dedicated keyboard, without corresponding semantics, validation etc, you can use inputmode attr, eg:

<input type="text" value="+1234567890" inputmode="tel" />
<input type="text" value="123.45" inputmode="decimal" />
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文