单击iframe时,页面跳转到顶部

时间:2016-01-06 08:32:26

标签: iframe

点击iframe后,当我嵌入此gdrive iframe时,我的页面会跳到顶部:

<iframe height="400px" frameborder="0" width="600px" src="https://docs.google.com/document/d/1u9NFjTPBd-9mucQUPvkqLP84iV6uaEcJNF5vQdHmYh8/edit?usp=sharing&rm=embedded"></iframe>

JSFiddle:https://jsfiddle.net/0qpe53os/

问题:为什么会这样做?如何防止它这样做?

我试图preventDefault没有任何运气。非常感谢您的帮助。

3 个答案:

答案 0 :(得分:1)

我不确定这是否有用。顺便说一句,你可以使用onload属性来向下滚动页面: 的的onload = “滚动(0,screen.height);”

<iframe height="400px" frameborder="0" width="600px" src="https://docs.google.com/document/d/1u9NFjTPBd-9mucQUPvkqLP84iV6uaEcJNF5vQdHmYh8/edit?usp=sharing&rm=embedded"  onload="scroll(0,screen.height);"></iframe>

答案 1 :(得分:0)

从我的调查来看,它不是由iframe本身造成的。其原因是由嵌入式谷歌文档执行的JavaScript。当谷歌文档的编辑区域收到焦点时,就会发生这种情况。如果您访问菜单区域没有任何反应,除非它导致某些内容被添加到编辑区域。我尝试使用沙箱属性限制iframe,但这种情况不再发生,但当然您无法使用Google文档。

很抱歉没有建议的解决方案。

答案 2 :(得分:-2)

您可以使用javascript检查iframe是否为活动元素,如果它处于活动状态则跳回到它。

if(document.activeElement.tagName == 'IFRAME') { document.activeElement.scrollIntoView() }

有关工作示例,请参阅此Jsfiddle