Android浏览器textarea滚动到所有地方，无法使用

因此，我构建了一个漂亮，闪亮的HTML5应用程序，针对移动Safari和Android的默认浏览器。我测试的Android版本是2.1和2.2。Android浏览器textarea滚动到所有地方，无法使用

我的应用程序在它的一个页面上有一个textarea，这个textarea有时会有很多文本。它基本上是一个自由形式的写作领域。

这可以在iOS中按预期工作。但是，在Android上，键入内容时，屏幕会在每次击键时大幅上下滚动，但通常在打字时无法看到您正在键入的内容，并且在所有跳转时都会晕眩。此外，如果textarea内的内容超过其高度，则无法在其中滚动。

甚至不让我开始横向模式。上述问题在那里更加突出。

这感觉就像一个Android的错误，因为我的textarea真的没有什么奇特的。我已经将它精简到基本的要素，并且它的行为相同。

想知道是否有其他人对他们的textareas在Android上有很多乐趣，也许可以提供一些建议，或者至少感同身受？

似乎Google已经设法在Android的Gmail网络界面中解决这个问题。我猜这里有一些JS魔法，因为我的标记/ CSS是相同的。

来源

2010-12-20 Eschaton

几乎在每个页面上都会遇到这种情况。这里在StackOverflow上，在WordPress的博客和更多。

我只能图像，这是在Android浏览器中的可用性错误/问题，这就是为什么我喜欢原生UI /应用:)

来源

2010-12-20 13:09:52 WarrenFaith

没有神奇的答案。 Android键盘输入与网页表单的交互是非常可怕的。您必须非常小心地穿针以使其正常工作，并且键盘行为在Android版本中不一样。但是有很多工作是可能的（参见我们的Sencha Touch框架今天的可能性 - 其他移动web框架也在处理完全相同的问题）。

来源

2010-12-21 00:55:07

奇怪的是我想只有基本的textarea功能，比如滚动，键入和在光标周围移动，我可以在Gmail上做这些事情或多或少，但在我自己的网页上，不是，似乎有什么特别的阻碍它，也许它是我使用的jQTouch库。 – Eschaton 2010-12-21 16:29:59

解决方案： 3D webkit在Android中被破坏，这导致了这个问题。确保你没有使用-webkit-transform：translate3d（0，0，0）;或-webkit-backface-visibility：hidden;与任何与投入有关的事物。 :(

来源

2011-04-20 18:34:50

解决方案为我工作了几个小时后，我的头撞在桌子上我的textarea突然停止工作B/C我已经添加了translate3d（0,0,0）到我的骗局茶壶谢谢！ – istan 2011-07-03 01:28:16

如果可能的话，您可以在用户通过将body的overflow属性设置为'hidden'来锁定屏幕滚动时 - 您可以在focus/blur事件中选择性地启用/禁用它。当然，这并不意味着你的用户在输入时将无法滚动

来源

2011-04-25 18:24:26 Mike

感谢您的建议！在我的情况下，输入字段的位置是：固定div，覆盖底层页面。每当该领域获得焦点（从水龙头），覆盖的页面随着Android软键盘反复出现并消失而疯狂地滚动。设置溢出：在显示覆盖图时隐藏在身体上似乎可以防止疯狂的行为。我只需要预先保存页面滚动位置并在之后恢复。 – 2012-05-10 18:27:54

Android浏览器textarea滚动到所有地方，无法使用

回答

相关问题