javascript - 当我达到某个div时，scrollTop不起作用

我正在尝试实现滚动加载。

这是我的滚动代码

$(window).on("scroll", function(){
    if( ($(window).scrollTop()-350) + $(window).height() == $(document).height()){

        loaddata();
    }
});

我要从scrollTop减去350，因为我希望在某个div上触发的AJAX请求进入视口。

为什么此代码不起作用。

这里的loaddata是具有AJAX请求的函数。

但是，当我运行此代码时，它可以工作：

$(window).on("scroll", function(){
    if($(window).scrollTop() + $(window).height() == $(document).height()){

        loaddata();
    }
});

但是，我必须转到页面末尾才能触发AJAX请求。

为什么在我从scrollTop减去350的情况下该代码不起作用？当我达到某个div时，我需要触发AJAX，该怎么办？

最佳答案

这里有两个独立的问题。一种是您正在测试确切的滚动位置，另一种是您要向滚动位置添加350px而不是减去它（因此该函数将在窗口结束前触发350px，而不是在窗口结束后触发350px结束）。

尝试这个：

if( $(window).scrollTop() + $(window).height() + 350 >= $(document).height()) {
    loaddata();
}

但是请记住，滚动事件会连续触发，您可能只希望loaddata()触发一次！因此：

var loadedData = false;
$(window).on("scroll", function() {
  if (loadedData) return;
  if ($(window).scrollTop() + $(window).height() + 350 >= $(document).height()) {
    alert("Fire loaddata now");
    loadedData = true;
    loaddata();
  }
});

...并将您的loaddata()函数将loadingData设置为false，以在必要时重新启用滚动触发器。

http://plnkr.co/edit/4QeGuRIdRQ6NchFvUiNt

关于javascript - 当我达到某个div时，scrollTop不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/31277687/