Question

我正在尝试在jquery中编写一个函数，当单击一个按钮时，将保存用户的滚动位置，然后当页面加载按钮所指向的链接时，将检索滚动位置。这是我的功能。我不确定问题是什么，因为我对此比较陌生。

var scrolltop;

$(document).ready(function(){
 $('a.page-numbers').click(function() {
  scrolltop = $(document).scrollTop(); // store it
  var href = $(this).attr('href'); 
  window.location= href; // I am doing this to force a button to go to a link and temporarily fix a pagination issue if people are curious.  Not the current issue at hand.
  return false; // Doing this so page doesn't scroll on click
 });
});

$(document).ready(function(){
 $('html, body').animate({scrollTop: scrolltop}); //not scrolling to where saved
});

任何可以使其移动（ios，Android等）兼容的人的奖励积分：）

Answer 1

我认为问题在于您将位置保存在本地变量中，当您加载新页面时，该变量会消失。

您需要某种方法将滚动顶部值传递给新页面。我建议使用网址哈希 - 请参阅https://developer.mozilla.org/en-US/docs/Web/API/Window/location#Example_3

所以点击：window.location = href + '#' + scrollTop;（注意：如果您的任何链接已经有哈希值，就像我上面的链接一样，您需要采取更复杂的方法将scrollTop与旧哈希合并，并在另一端将它们分开）

正在加载：var scrollTop = window.location.hash;

Answer 2

使用会话存储创建。可以工作但不漂亮，因为它在页面加载时从顶部开始，并在点击链接之前立即跳转到你所在的位置。

$(document).ready(function(){
 $('a.page-numbers').click(function(){
  sessionStorage["scrollPosition"] = $(window).scrollTop();
 });
 $(window).scrollTop(sessionStorage["scrollPosition"]);
   sessionStorage.clear();
});

点击后保存滚动位置然后检索？

2 个答案: