jquery - 如何恢复 jQuery 中刷新的 div 的滚动位置？

Question

我有一个非常大的 div，它使页面在垂直和水平方向上都有滚动条。

每隔几分钟，我希望 div 的内容被刷新，所以我使用 jquery get 将 div 内容重新加载到 div 中。

要注意的是，我不想改变用户正在查看的屏幕上的位置，我希望重新加载 div，但用户仍应查看 div 中的相同位置(意思是div 不应滚动回 (0,0)。

当用 $( "#mainwrapper").html( data ); 将 html 覆盖到 div 时有时会发生什么，div 暂时是空的，所以它缩小，然后重新填充，但用户现在在 ( 0,0)

希望这是有道理的。

Answer 1

在将内容加载到 div 之前，保存滚动位置。

var scroll_l = $('#yourdiv').scrollLeft(),
  scroll_t = $('#yourdiv').scrollTop();

每次滚动 div 时，保存位置，以便在加载时滚动也被保存。

$('#yourdiv').scroll(function() {
  if ($('#yourdiv').html().length) {
    scroll_l = $('#yourdiv').scrollLeft();
    scroll_t = $('#yourdiv').scrollTop();
  }
});

然后，加载新内​​容并重新应用滚动位置:

$('#yourdiv').load('/your/url', function() {
  $('#yourdiv').scrollLeft(scroll_l);
  $('#yourdiv').scrollTop(scroll_t);
});