iOS7使用键盘HTML时，webview焦点问题的解决方法

Question

Sencha - 我有一个包含注册表单的网页应用，在Safari浏览器上可以正常使用。但是，当我将该页面添加到主屏幕（使用iOS Webview）时，出现了以下问题：

当我点击文本框时，键盘并没有缩放到被选中的特定文本框。为了开始在该文本框中写入内容，我需要再次点击该文本框。

我正在使用Sencha。

- ItzikEdar

Answer 1

我找到了iOS 7的解决方案。在你的HTML页面中使用以下meta标签：

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, target-densityDpi=device-dpi" />

- J. Furr

---

它确实解决了问题，但只是部分地。使用 height=device-height 使得内容与设备大小相同，包括顶部状态栏的高度。这使得内容实际上比可用空间更高（在状态栏下方）。 它可以与 meta 标签结合使用： <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> 使内容出现在状态栏下方，但它并没有给我期望的外观。 - Mart

“height=device-height” 似乎是解决这个问题的选项。如果我把它移除掉，它就停止工作了。 - Martin Thurau

这可以解决问题，但是会出现不必要的溢出滚动条。有没有其他方法来解决？ - peterkr

好的，谢谢。顺便说一句：我的应用只支持横屏模式，使用 height=device-height 会将高度设置为竖屏模式的高度。当我使用 height=device-width 时，它可以正常工作。这可能对一些人有帮助。 - Thomas

请注意，在WebKit中，meta标签上的target-densityDpi=device-dpi属性已被弃用。请参见：https://dev59.com/AGgu5IYBdhLWcg3wFDRr - Wally Lawless

Answer 2

我遇到了同样的问题。在我的情况下，我正在使用jQuery Mobile，为了解决这个问题，我在输入框中添加了"autofocus"属性。
这似乎模拟了对字段的第一次点击，而用户的点击会打开键盘并使其能够向字段中写入内容。
希望这可以帮助你。

- George

---

绝对棒极了。当height=device-height由于固定的页眉/页脚而不可行时，这个方法非常有效。 - Adam Marshall