如何使用jQuery检测页面的滚动位置

我有我的网站下面的jQueryfunction,它是这样做的,它使用window.scroll()函数来识别何时更改窗口的位置更改和更改调用几个函数从服务器加载数据。

问题是.scroll()函数只要在滚动位置和加载数据在底部有一点变化就立即被调用,但是我希望实现的是当滚动/页面位置到达底部时加载新的数据,就像Facebook feed一样。

但我不知道如何使用jQuery检测滚动位置?

 function getData() { $.getJSON('Get/GetData?no=1', function (responseText) { //Load some data from the server }) }; $(window).scroll(function () { getData(); }); 

你可以使用jQuery's .scrollTop() method提取滚动位置

 $(window).scroll(function (event) { var scroll = $(window).scrollTop(); // Do something }); 

您正在寻找window.scrollTop()函数。

 $(window).scroll(function() { var height = $(window).scrollTop(); if(height > some_number) { // do something } }); 

请点击这里DEMO http://jsfiddle.net/yeyene/Uhm2J/

 function getData() { $.getJSON('Get/GetData?no=1', function (responseText) {  //Load some data from the server }) }; $(window).scroll(function() { if($(window).scrollTop() + $(window).height() == $(document).height()) { alert("bottom!"); // getData(); } }); 
 $(window).scroll( function() { var scrolled_val = $(document).scrollTop().valueOf(); alert(scrolled_val+ ' = scroll value'); }); 

这是获得滚动值的另一种方式。

回传时,将滚动的值存储为HiddenField中的值,并在添加回滚时进行检索。

 //jQuery jQuery(document).ready(function () { $(window).scrollTop($("#<%=hidScroll.ClientID %>").val()); $(window).scroll(function (event) { $("#<%=hidScroll.ClientID %>").val($(window).scrollTop()); }); }); var prm = Sys.WebForms.PageRequestManager.getInstance(); prm.add_endRequest(function () { $(window).scrollTop($("#<%=hidScroll.ClientID %>").val()); $(window).scroll(function (event) { $("#<%=hidScroll.ClientID %>").val($(window).scrollTop()); }); }); //Page Asp.Net <asp:HiddenField ID="hidScroll" runat="server" Value="0" /> 

现在适合我…

 $(document).ready(function(){ $(window).resize(function(e){ console.log(e); }); $(window).scroll(function (event) { var sc = $(window).scrollTop(); console.log(sc); }); }) 

它工作得很好…然后你可以使用JQuery / TweenMax来跟踪元素并控制它们。