jquery -在将项目添加到列表中时，防止窗口更改滚动位置？
jquery -在将项目添加到列表中时，防止窗口更改滚动位置？
提问于 2012-03-23 12:22:42
我有一个显示消息的页面，我想让它像Facebook一样工作，但没有懒惰的加载程序。消息按时间顺序显示，最近的显示在最后。
我的消息列表最初填充的是x最新消息的数量，并且窗口滚动到底部。当用户开始阅读线程时，他们从下到上阅读。如果他们到达顶端，他们可以加载更多的消息...我让他们点击一个按钮。facebook有一个懒惰的加载程序。新消息将作为列表的前缀。
问题:当新的消息被放在前面时，现有的消息被下推，导致用户失去他们的“查看”位置。如何在添加新消息时保持用户当前的查看位置？例如，在facebook中打开一个长消息线程，滚动到顶部，添加新消息……您的视图位置不会更改，即使滚动位置会更改。
回答 4
Stack Overflow用户
发布于 2016-05-14 14:25:20
一些来到这里的人可能只想添加内容，而不想让当前的焦点跳跃。将Jeff B上面的demo修改为使用click事件目标，使此习惯用法更易于移植：
someButton.on('click', function() {
var curOffset = $(this).offset().top - $(document).scrollTop();
// add content to your heart's content.
$(document).scrollTop($(this).offset().top-curOffset);
});c.f.http://jsfiddle.net/bwz8uLvt/1/ (上面Jeff B演示的变体，但在页面中的任意位置使用add more按钮)。
Stack Overflow用户
发布于 2018-09-10 00:55:38
这里有一个对我有效的简单技巧：
// divWithTheScroll.prependElement...
divWithTheScroll.scrollTop += newlyPrependedElement.scrollHeight;Stack Overflow用户
发布于 2016-09-14 02:49:28
您还可以根据到页面/元素底部的偏移量来保持滚动位置。
var ScrollFromBottom = $(document).height() - $(window).scrollTop();
//ajax - add messages -- geenrate html code then add to dom
//set scroll position
$(window).scrollTop($(document).height() - ScrollFromBottom);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/9834143
复制相关文章
相似问题