HTML5自动聚焦属性使Firefox滚动到页面底部_Firefox_Twitter Bootstrap_Autofocus

HTML5自动聚焦属性使Firefox滚动到页面底部

firefox twitter-bootstrap

HTML5自动聚焦属性使Firefox滚动到页面底部,firefox,twitter-bootstrap,autofocus,Firefox,Twitter Bootstrap,Autofocus,我们有一个HTML5应用程序（），它带有Twitter引导和各种其他JavaScript库（包括jQuery）——所有这些都在当前版本上运行该页面包含设置了自动对焦属性的文本输入该页面包含多个“屏幕”内容，这意味着页面上始终会有一个垂直滚动条。文本输入位于页面的第一个“折叠”内，距离页面顶部约250像素在Chrome、Safari和Opera上，页面按预期工作。当页面加载时，元素在屏幕上并聚焦在FireFox（当前版本-18.0.1）上，元素具有焦点，但页面已滚动至1533px（通过w

我们有一个HTML5应用程序（

），它带有Twitter引导和各种其他JavaScript库（包括jQuery）——所有这些都在当前版本上运行

该页面包含设置了

自动对焦

属性的文本输入

该页面包含多个“屏幕”内容，这意味着页面上始终会有一个垂直滚动条。文本输入位于页面的第一个“折叠”内，距离页面顶部约250像素

在Chrome、Safari和Opera上，页面按预期工作。当页面加载时，元素在屏幕上并聚焦

在FireFox（当前版本-18.0.1）上，元素具有焦点，但页面已滚动至1533px（通过window.pageYOffset确定）。内容长度不同的同一页面将始终滚动到同一位置，元素将呈现在屏幕外

肯定只有一个元素设置了自动聚焦属性（

$（“[autofocus]”）。长度

）

从元素中删除autofocus属性根本不会导致页面滚动（即页面保持滚动到顶部-如预期）

有人能提供帮助或见解吗

我们尝试过的事情以下测试工作正常：

<!DOCTYPE html>
<html>
<head>  </head>
<body>
  <div style="height: 200px">
    <h1>Test</h1>
  </div>
  <div style="height: 2000px">
    test
    <br />
    <input autofocus type="text" />
  </div>
</body>
</html>


试验
测试

您需要css代码来说明这一点：

.focusedInput{
边框颜色：rgba（82168236.8）；
大纲：0；
轮廓线：细点\9；
-moz盒阴影：0 0 8px rgba（82168236，.6）；
盒影：0 0 8px rgba（82168236，.6）！重要；
}

然后，文本输入代码如下所示：

我们最近用Firefox重试了这个问题，无法复制这个问题

关闭…

你能发布一个链接到无法正常工作的测试吗？我在Chrome 25中也看到过这种行为，但没有看到失败的地方，很难回答这个问题。类似的行为也发生在我身上，因为我在页面底部呈现了模态，并设置了自动聚焦属性。即使modals没有激活，Firefox也会滚动到自动聚焦的输入。除了，这实际上不会聚焦控件！