jQuery - 带Scroll的延迟加载函数

时间:2011-11-23 03:41:37

标签: jquery

我有一个页面加载5行结果,还有5个点击。

我想要做的就是在滚动上再显示5个,就像一个懒惰的加载器,而不是点击...感谢任何帮助。

$(function() {
  initShowMore();
  $("span#showMore a.moreResults").click(loadMoreResults);
});

function initShowMore() {
  var has_more = $("form#data input[name=has_more_results]").val();
  if (has_more) {
    $("table span#showMore").show();
  } else {
    $("table span#showMore").hide();
  }
}
function loadMoreResults() {
  if (loading) {
    return;
  }

  loading = true;

  var has_more = $("form#data input[name=has_more_results]").val();
  var page = parseInt($("form#data input[name=page]").val());

  var data = gatherQueryParams();
  data.page = page + 1;

  append = true; // global
  load(data);
}

1 个答案:

答案 0 :(得分:2)

您需要挂钩scroll事件。从我所知道的,你的情况相当简单(例如你不想加载与页面上特定位置有关的结果),所以希望一些相当简单的代码可以工作。 :)

我添加了if以查看页面是否已向下滚动得足够远,因为您可能只想在某个点之后触发它。

        $(document).scroll(function ()
        {
            if ($(document).scrollTop() > $(".someelement").position().top) loadMoreResults();
        });