javascript - 添加内容时如何防止文档自动滚动？

Question

我有一个网络应用程序，其内容类似于 facebook 墙。当您单击一个按钮时，它会在当前内容的末尾添加更多内容，然后应该滚动到它。但是目前如果我向下滚动了任何数量，当我添加内容时，页面突然向下滚动一个看似随机的数量，我还没有添加滚动到代码。为什么页面会自动滚动？以及如何让它停止？

Answer 1

无需深入了解您的代码可能是什么的最简单方法就是抵消您添加的内容。因此，使用一些 js 找出新内容将添加的高度，然后在添加时向下滚动该数量

Answer 2

虽然我不确定为什么会发生这种情况，但我知道您应该能够使用 CSS 来避免在向页面添加内容时出现任何滚动。如果在添加内容之前将body 溢出设置为隐藏，然后将其设置回可见，则应该能够防止发生任何滚动。

如果您使用的是 jQuery，则如下所示：

$(document.body).css('overflow','hidden');
// do your stuff here e.g.
for(var i=0;i<1000;i++) {
   $(document.body).append('<div>some content to append here</div>');
}
$(document.body).css('overflow','visible');

注意：如果它是附加内容的第 3 方库并且他们使用 JS 滚动页面，则此解决方案可能不起作用。