获取当前滚动位置并通过链接将其作为变量传递? [英] Get current scroll position and pass it as a variable with a link?

问题描述

老实说，我在这里超出了我的理解范围.我创建了一个分页系统，您单击链接即可重新加载页面，并在无序列表中显示一定数量的列表项.再次单击它会重新加载页面，并显示更多项目.想想Twitter如何在您的Feed中显示推文.

I'll be honest, I'm way out of my depth here. I've created a pagination system where you click on a link it reloads the page and a certain number of list items are shown in an unordered list. When you click it again it'll reload the page and more items showing. Think how Twitter shows the tweets in your feed.

问题是当它重新加载页面时，它停留在顶部.我想让它跳到以前在页面上的相同位置.

The problem is when it reloads the page it stays at the top. What I would like is for it to jump to the same position on the page it previously had.

我已经为链接设置了一个选择器，但我只是不知道如何获取当前滚动位置，然后将其传递到新页面以跳转到该页面.

I already have a selector for the link set up fine I just don't know how to get the current scroll position and then pass it to the new page for it to jump to.

到目前为止，这是我的代码:

Here's my code so far:

jQuery(document).ready(function(){
    $("a[rel=more]").live("click", function(){
        //script...
    });
});

我从这里去哪里?

推荐答案

1. 使用AJAX重新加载项目，而不是重新加载整个页面.

1. Reload the items using AJAX instead of reloading the whole page.

使用window.pageYOffset和window.scrollTo(0, y)获取并设置滚动位置.

Get and set the scroll position using window.pageYOffset and window.scrollTo(0, y).

我将位置存储在URL的哈希中:

I'd store the position in the hash of the URL:

// after loading the document, scroll to the right position
// maybe location.hash has to be converted to a number first
$(document).ready(function() {
    window.scrollTo(0, location.hash);
});

// I'm not quite sure if reload() does preserve the hash tag.
location.hash = window.pageYOffset;
location.reload();

这篇关于获取当前滚动位置并通过链接将其作为变量传递?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！