HTML5:输入type="number“的额外字符

Question

在我们的应用程序中，我们有许多用来填写学校成绩的输入。直到现在我们

<input type="text" name="mark">

当我们试图使用HTML5的新特性时，我们将其更改为

<input type="number" name="mark">

因此，在手机/平板电脑上，我们只有数字接口。情况就是这样。这是可能的，在输入等级，如"5+“和其他(例如，一些两个字母快捷键"ab”和其他)。它可以由用户定制。

有什么方法可以通过扩展Android/iOS键盘布局来扩展输入来处理数字和所有字符呢？

编辑：

别忘了我想知道我是否可以在手机上扩展键盘布局。如果这是不可能的，我将回到文本与一些验证。

Answer 1

我相信您可以将模式属性用于您所描述的内容：

用于检查控件值的正则表达式。模式必须匹配整个值，而不仅仅是某个子集。使用title属性来描述帮助用户的模式。当类型属性的值为文本、搜索、电话、url或电子邮件时，此属性将应用；否则它将被忽略。正则表达式语言与JavaScript语言相同，该模式不被斜杠包围。

https://developer.mozilla.org/en/docs/Web/HTML/Element/Input

例如<input type="text" name="HasAPattern" pattern="[0-9A-Z]{3}" title="Enter 3 characters">

将导致一个只允许3个字符的输入元素。

不幸的是，我认为自定义键是不允许的，所以您必须使用带有上面属性的添加数字模式的文本类型。

自定义键盘必须用于非标准键盘布局/输入按钮。

Answer 2

如果用户输入的数据不正确，您可能希望只使用普通文本字段，并使用类似于JQuery验证的方法来限制输入和抛出警告。

另一个选项是将所有可能的选项输入到HTML选择标记中。

JQuery验证插件：http://jqueryvalidation.org/

Answer 3

您可以使用

    <input type="text" name="mark" pattern="[a-z0-9]{2}">

您可以在模式中指定正则表达式，并将任何字符白色显示。

对于具有50+类型的输入，请使用以下方法

   <input type="text" name="mark" pattern="[0-9]{2}[+]?">