android - 使用 HTML5 'tel' 输入屏蔽 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]*" ... />