Phonegap Android键盘覆盖了input元素滚动禁用

我已经尝试了许多不同的解决scheme,没有什么是我想要的。 我想要的是让键盘显示在内容的顶部(保持内容的大小相同),同时能够滚动到键盘覆盖的input元素。

我试过的每个解决scheme都会给我一个或另一个,但不是两个。

我试过的解决scheme:

  • 这里解决。 将android:windowSoftInputMode =“adjustPan”和android:configChanges =“orientation | keyboardHidden”添加到我的AndroidManifest.xml中的主要活动中。
  • 上述解决scheme使用“adjustResize”而不是“adjustPan”。
  • 这里解决。 添加到我的confix.xml。

使用adjustPan保持我的元素相同的大小,但禁用滚动。 使用adjustResize调整整个页面,使一切缩小。 保持默认设置,只有包含input元素的包装器被resize,但是滚动被启用。

我设法在这里find了完全相同的问题(未答复)。 他们能够通过将应用程序调整到150%来“修复”它,并滚动到所涵盖的input元素,但是就像他们说的那样不理想。

任何帮助表示赞赏。

Solutions Collecting From Web of "Phonegap Android键盘覆盖了input元素滚动禁用"

对于config.xml中的大多数情况,将全屏首选项更改为false。 这将会诀窍。

<preference name="fullscreen" value="false" /> 

我有最有效的解决scheme自动滚动到input,并使其可见。 首先,您需要添加离子键盘插件(适用于任何cordova项目),因为eventlistener'showkeyboard'现在不起作用。

 cordova plugin add ionic-plugin-keyboard --save 

然后,在“keyboardshow”事件的事件处理程序中,添加以下代码:

 window.addEventListener('native.keyboardshow', function(e){ setTimeout(function() { document.activeElement.scrollIntoViewIfNeeded(); }, 100); }); 

PS:这仅在Android(Chrome)和Safari上受支持。 :d

你可以检测集中的textareainput ,然后等待一段时间,直到键盘显示,最后滚动页面到达焦点input。

 $("#textarea").focus(function(e) { var container = $('#container'), scrollTo = $('#textarea'); setTimeout((function() { container.animate({ scrollTop: scrollTo.offset().top - container.offset().top + container.scrollTop() }); }), 500); }); 

当键盘被隐藏时, textarea保持聚焦,所以如果再次点击键盘,键盘将显示,容器需要再次滚动以显示input

 $("#textarea").click(function(e) { e.stopPropagation(); var container = $('#container'), //container element to be scrolled, contains input scrollTo = $('#textarea'); setTimeout((function() { container.animate({ scrollTop: scrollTo.offset().top - container.offset().top + container.scrollTop() }); }), 500); }); 

希望这有助于,欢呼!

我为键盘事件添加了一个事件监听器,并且只有当它在屏幕外时才滚动到input。

对于我的情况,我只想在第一次显示键盘时滚动,只有当input项目在屏幕外。

 document.addEventListener('showkeyboard', onKeyboardShow, false); function onKeyboardShow(e) { setTimeout(function() { e.target.activeElement.scrollIntoViewIfNeeded() }, 500) //needed timeout to wait for viewport to resize } 

为了让showkeyboard事件触发,我需要在AndroidManifest.xml中有以下内容

  android:windowSoftInputMode="adjustResize" 

我有同样的问题为Android项目输出,在我的情况下,input元素不向上移动键盘。 经过一夜的search( 包括那些configuration更改等 ),我发现在我的angularjs cordova项目

 StatusBar.overlaysWebView(true); StatusBar.hide(); 

在我的控制器中引起这个恼人的问题。 而我正在使用这些线路的ios状态栏问题,现在我把这些在一个条件和问题是固定的。

 if( device.platform=="iOS") { StatusBar.overlaysWebView(true); StatusBar.hide(); } 

我正在使用Cordova插件'ionic-plugin-keyboard',并听取'native.keyboardshow'和'native.keyboardhide'事件来调整我的表单的HTML容器元素的大小:

  window.addEventListener('native.keyboardshow', function (e) { container.style.bottom = e.keyboardHeight + "px"; }); window.addEventListener('native.keyboardhide', function () { container.style.bottom = null; }); 

这会导致正确的input字段滚动到视图中(也可以在字段之间前后移动)。

我解决了这个问题。 我有一个媒体查询在我的CSS中的某些元素的大小更改为较小的屏幕尺寸。 编辑该查询解决了我的问题。

如果你已经按照cordova文件所说的那样正确地完成了这个项目,它就不会发生。

可能是你使用像iScroll的滚动库?