只有 Google Chrome 和 Safari 会出现这种情况。这是有问题的页面: http://jqeedu.tuxfamily.org/pmr/
打开登陆后,点击发布你的公寓
,通过ajax加载一个表单,页面自动滚动到底部,如果向上滚动,又回到底部!
这是什么原因造成的?
编辑:
对此感到抱歉,但我等了几个小时,然后因为它必须被修复,所以开始试验它并改变了几件事并最终解决了这个问题。我在这个过程中学到的是:
- 我在页面上有一个零宽度和高度的
iframe
作为上传表单的target
,这样我们就可以在不刷新页面的情况下上传照片。此iframe
是body
中的最后一个元素。当我将其位置更改为顶部时,滚动从坚持底部位置变为坚持页面顶部位置。现在该页面不允许您向下滚动页面! - 这是个好消息,因为现在我知道它是什么了,它是由
iframe
引起的。iframe
的src
属性设置为#
;我怀疑这一点,并将其更改为指向一个真实文件(一个空白的 html 框架),创建该文件,问题就消失了!
所以,我的分析是这样的:浏览器卡在 loading
文件到 iframe
和负责loading
内容的进程正在运行。这个过程以某种方式不允许我们滚动到 iframe
会超出 viewport
的区域。这是 webkit
引擎的错误行为,使用 webkit
构建的浏览器展示了这个问题。
最后,下面的代码片段显示了更改前后 iframe
的代码,以及新目标文件的内容。
buggy :
<iframe id="control_target" name="control_target" src="#"
style="width:0;height:0;border:0px solid #fff;"></iframe>
好:
<iframe id="control_target" name="control_target" src="blank.html"
style="width:0;height:0;border:0px solid #fff;"></iframe>
空白.html:
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body> </body>
</html>
最后,我不喜欢将自己的答案标记为已接受的答案,所以我将其放在问题的正文中,我等待有人对这个问题的性质进行更多解释或提供更好的分析。如果提供了这样的答案,我会将其标记为已接受的答案。
最佳答案
在 Safari 5 中也能正常工作。也许表单底部的某个元素正在接收焦点,这会导致页面滚动。
关于safari - 为什么这个页面会自动向下滚动到底部?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2993372/