使用HTML5＆＃39; tel＆＃39;屏蔽PIN的输入

Question

好的，我一直在阅读这方面的一些内容，并且遇到了一些限制......所以就这样了。

共识似乎是'tel'输入是强制过滤输入到移动设备上的数字输入的最简单/最好的方法。主要是因为它触发数字键盘。

我正在尝试在HTML5中使用'tel'输入字段来提示用户在表单中提交他们的数字PIN号码以进行提交。这是输入代码：

<input type="tel" pattern="[0-9]" name="PIN" value="" maxlength="10" placeholder="Numeric PIN only" autofocus required />

有几件事：

1. 如何在页面加载时显示键盘，
2. 如何屏蔽type="password"输入字段
之类的值

键盘会在我点击输入时显示，但是当页面加载时我会非常喜欢它（或任何其他键盘）。

我希望能有一个“轻量级”/本机解决方案，如果这种情况完全可能，因为我正在处理低带宽要求。

非常感谢提前。

Answer 1

1）要使键盘显示，请在页面使用javascript加载到文本输入字段时设置焦点。您可能需要添加延迟：

setTimeout(function_that_sets_input,5000);

注意：此解决方案在iOS 5及更早版本中存在某些问题。有时候setTimeout不会被触发。一个更强大的解决方案是从viewDidAppear（或类似）中的Obj-C代码调用javascript方法。

2）See this answer。您将要将模式设置为：

<input type="password" pattern="[0-9]*" ... />