javascript - Google chrome 中的奇怪行为(提交表单后，它会转到页面底部)

Question

我有模板设计。一切正常，除非我提交表格。当服务器响应(同一页面)时，它会转到页面底部。如果整个页面大于屏幕高度，就会发生这种情况。

• 示例(如果整个页面小于屏幕高度):
  • 提交表单，服务器返回相同的页面，然后页面保持在顶部。
• 示例(如果整个页面大于屏幕高度):
  • 提交表单，服务器返回相同的页面，然后页面转到底部。

我已经禁用了 javascript(删除了 <script> 标签)。而且它只发生在 Chrome 中。

我在firefox和IE中测试过，提交表单后页面会一直在顶部。

..........

另外，如果我放一个空的 <script> </script>内容之前的标签，就像这样。该页面(在 Chrome 中)将保留在顶部。我假设它必须与 Chrome 呈现页面的方式有关。

如果没有<script>标记，Chrome 将主动呈现页面。如果有 <script>标记内容中的某处，它会使它呈现得更慢或不同。

..........

此外，我正在使用 Symfony2(一种 PHP 框架)，每次在 dev 中都会发生这种情况。模式。当我切换到 prod模式(css 和 js 被编译和合并)，它很少发生。

我通常会说问题是 CSS/HTML 布局，但只发生在 Chrome 中，如果页面及时(快速)提供，问题就会消失(页面保持在顶部)。

我的问题是:这是一个已知问题吗？它可以相对容易地修复吗？还是我应该祈祷页面加载速度快，这样问题就不会发生？

Chrome 版本:38.0.2125.111(64 位)

如果您需要更多详细信息，我很乐意提供。提前致谢

编辑: 服务器响应同一页面 dev和 prod模式。不同之处在于 prod模式，它针对生产环境进行了优化。合并和编译 CSS/JS，使页面加载速度更快。

Answer 1

如果有任何人遇到这种情况，这是我的解决方案:

确保缩小/丑化、编译/合并 CSS。使用积极的缓存。因此，Chrome 不会在没有必要的 CSS 样式的情况下呈现页面。

使用 <script> </script>内容中某处的标记是黑客攻击。

我建议使用 jquery:

$('html,body').animate({scrollTop: 0}, 'slow');

只有在提交表单后没有重定向(表单有错误)时才会出现此问题。如果存在表单错误，您可能会显示消息 div 警报，因此使用该脚本您将滚动/动画到该 div 元素。