1

[请注意，我只能在 Android 移动网络浏览器（通过模拟器使用）上重现该问题。]

概括

单击一个锚点转到页面底部，然后单击另一个锚点到页面顶部 - 并在顶部的文本框中输入内容，您将向下滚动到页面底部的锚点。

初步调查

似乎这种行为在某种程度上是具有视口元标记的结果。我推测，当用户开始键入时，Android 上的浏览​​器会混淆锚链接以及用户在视图中拖动的位置。我意识到这是一个有点复杂的场景，但有人有解决这个问题的提示/建议吗？

重现步骤：

A. 使用以下标记创建一个新网页 test.html：

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head>
    <meta name="viewport" content="width = device-width; initial-scale=1.0; " /> 
</head> 
<body> 
   <a name="top"></a> 
   <input type="text" /> 
   <a href="#bottom">Bottom</a> 
   [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text]  [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text]  [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text]  [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text]  [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text]  [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text]  [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text] [Dummy Text]  
   <a name="bottom"></a> 
   <a href="#top">Top</a> 
</body> 
</html>

B. 在您的 Android 移动浏览器上，访问 test.html

C. 点击链接“底部”

D. 点击链接“置顶”

E. 点击文本框

实际结果：

浏览器向下滚动到页面底部。用户现在看不到他们输入的内容。

预期成绩：

浏览器在 E 之后不会滚动任何地方。用户可以输入文本而不会分心。

笔记：

如果用户拖动屏幕到顶部，那么他们可以在文本框中输入而无需向下滚动。该问题似乎与锚链接、文本框和视口标签无关。如果删除了这些变量中的任何一个，则该错误不存在。

4

1 回答 1

0

我想确认这个错误对我来说是根据 OP 的描述引起的。 其他讨论假设原因与 3dtransforms 和背面可见性有关。也许这也是问题的一个因素，但在我的情况下，禁用锚标签修复了这个错误。

于 2012-03-26T01:28:08.223 回答