10

我们有一个<!DOCTYPE html>带有 Twitter Bootstrap 和各种其他 JavaScript 库（包括 jQuery）的 HTML5 应用程序（

该页面包含一个带有autofocus属性集的文本输入。

<input type="text" autofocus="autofocus" />

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

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

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

肯定只有一个元素设置了自动对焦属性 ( $("[autofocus]").length)。

从元素中删除 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>
4

2 回答 2

0

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

关闭...

于 2014-04-03T00:10:23.117 回答
-1

你需要css代码这样说： .focusedInput { border-color: rgba(82,168,236,.8); outline: 0; outline: thin dotted \9; -moz-box-shadow: 0 0 8px rgba(82,168,236,.6); box-shadow: 0 0 8px rgba(82,168,236,.6) !important; } 然后文本输入代码是这样的： <input class="form-control focusedInput" type="text">

于 2014-03-05T13:40:13.587 回答