PhoneGap 键盘没有向上推 webview
Posted
技术标签:
【中文标题】PhoneGap 键盘没有向上推 webview【英文标题】：PhoneGap keyboard not pushing up webview 【发布时间】：2017-09-06 09:49:16 【问题描述】：我正在试验 PhoneGap，我的 html 开头为：
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="user-scalable=no, initial-scale=1, minimum-scale=1, maximum-scale=1, width=device-width, height=device-height" />
稍后在 HTML 中我有一个输入文本字段。通常，当输入字段获得焦点并显示键盘时，Web 视图会向上滚动。但是，在我的情况下，键盘覆盖了视图并且它不会向上滚动（如我所愿）。
如果我删除上面的<meta name="viewport" ...> 标记，视图会向上滚动，但也会横向滚动并且变得可伸缩（我不想要）。
如何在 android 和 ios 上获得所需的键盘（且仅键盘）将视图向上（且仅向上）推的行为？
编辑
我在Get viewport height when soft keyboard is on 中发现了一个类似的案例——我也有一些宽度和高度设置为 100% 的 fixed div：
.main position:fixed; top:0; left:0; width:100%; height:100%;
但是，如果我只是将定位修改为static，则视图不是“向上推”而是“被挤压”了......不是所需的行为。
【问题讨论】：
尝试删除高度声明 我做了（尝试仅删除高度声明），但它的行为似乎相似。注意我在 Android 上使用这个 PhoneGap 应用（用于测试）。 你设置<preference name="android-windowSoftInputMode" value="adjustResize" />了吗？
我想你指的是 config.xml 文件？鉴于上面的 HTML，这一行似乎没有改变......
【参考方案1】：
我想我发现了发生了什么，也是一个很好的解决方法：
在我的代码的其他部分，有一个函数每秒运行一次，对window.innerWidthwindow.innerHeight 进行采样以测试屏幕方向（配置文件与横向）。它还将这些新值分配给main div 的宽度和高度。
我做的“把戏”由两部分组成：
通过将“焦点”和“模糊”事件分配给输入文本字段来检测（几乎）虚拟键盘是“打开”还是“关闭”。
当“on”时，仅使用采样window.innerWidthwindow.innerHeight 的一半，因此实际内容很好地缩小到左上角，下面是keboard。
【讨论】：
以上是关于PhoneGap 键盘没有向上推 webview的主要内容，如果未能解决你的问题，请参考以下文章
Phonegap 3.5 - IOS 7.1+ - 键盘按键