Html 当URL包含片段时，iframe会导致父元素在Google Chrome上向上滚动
在Google Chrome（37.0.2062.122，OSX/Windows）上，带有包含片段的URL的iframe会导致父元素向上滚动 这只发生在Chrome中（在Safari和Firefox中测试） 这里有一把小提琴显示了这个问题：（你必须点击Html 当URL包含片段时，iframe会导致父元素在Google Chrome上向上滚动,html,google-chrome,iframe,jsfiddle,Html,Google Chrome,Iframe,Jsfiddle,在Google Chrome（37.0.2062.122，OSX/Windows）上，带有包含片段的URL的iframe会导致父元素向上滚动 这只发生在Chrome中（在Safari和Firefox中测试） 这里有一把小提琴显示了这个问题：（你必须点击Run两次。） 如您所见，包含iframe的整个已向上滚动。页眉是隐藏的，因为它现在位于窗口上方，并且页面底部有一个意外的空白 如何避免这种情况 Bounty提供了一个非js解决方案或一个更简单的html文档来重现这个问题 不仅是chrome，所有
Run不仅是chrome，所有浏览器都会有同样的问题，似乎该站点有大量的js脚本，不知道它会如何影响你放置iframe的站点，解决它的最简单方法是从链接中删除\up\u 8360397。 第二种方法是在iframe中禁用javascript。但是如果你不能自动向下滚动到你想要的帖子，你就必须手动设置滚动位置。 这里显示了两个bug
iframe{
位置：绝对位置；
排名：0；
右：0；
底部：0；
左：0；
宽度：100%；
身高：100%；
} var e = window,
g = document,
h = "documentElement",
k = "CriticalImages",
l = "scrollTop",
n = "prototype",
p = "body",
q = "getAttribute",
u = function(a, b) {
var c = b[q]("pagespeed_lazy_position");
if (c) return parseInt(c, 0);
var c = b.offsetTop,
d = b.offsetParent;
d && (c += u(a, d));
c = Math.max(c, 0);
b.setAttribute("pagespeed_lazy_position", c);
return c
},
编辑 在回顾了wiki示例之后，我发现有一些js（因此第一个答案是正确的） 要避免js出现这种情况，只需包括以下内容：
$( window.parent ).scroll(function(event) {
// debugger;
console.log('SCROLL',event);
var scrollTop=$(this).scrollTop();
if(scrollTop>0){
console.log('fix scroll');
$(this).scrollTop(0);
}
});
我将尝试查看导致问题的js。复制脚本 找到了一种复制错误的最小方法：（单击“load iframe”后，您可以看到错误发生） 它还使用以下代码在JSFIDLE之外发生：
<!doctype html>
<html>
<head>
<style>
body, html {
padding: 0;
border: 0;
margin: 0;
height: 100%;
overflow: hidden;
}
#header {
height: 50px;
background: blue;
}
#content {
position: absolute;
top: 50px;
right: 0;
bottom: 0;
left: 0;
}
#overflow {
position: absolute;
height: 50px;
bottom: -50px;
}
</style>
<script>
function loadIframe() {
var ifr = document.createElement('iframe');
ifr.src = 'https://en.wikipedia.org/wiki/Stack_overflow#See_also';
var content = document.getElementById('content');
while (content.firstChild) {
content.removeChild(content.firstChild);
}
content.appendChild(ifr);
}
window.onload = function () {
document.getElementById('btn').onclick = loadIframe;
};
</script>
</head>
<body>
<div id=header>
<button id=btn>load iframe</button>
</div>
<div id=content>
</div>
<div id=overflow>
overflow
</div>
</body>
</html>
正文，html{
填充：0；
边界：0；
保证金：0；
身高：100%；
溢出：隐藏；
}
#标题{
高度：50px；
背景：蓝色；
}
#内容{
位置：绝对位置；
顶部：50px；
右：0；
底部：0；
左：0；
}
#溢出{
位置：绝对位置；
高度：50px；
底部：-50px；
}
函数loadIframe（）{
var ifr=document.createElement（'iframe'）；
ifr.src=https://en.wikipedia.org/wiki/Stack_overflow#See_also';
var content=document.getElementById（'content'）；
while（content.firstChild）{
content.removeChild（content.firstChild）；
}
内容。附加子项（ifr）；
}
window.onload=函数（）{
document.getElementById（'btn'）。onclick=loadIframe；
};
加载iframe
溢流