Javascript jquery getScript（url）重复调用

我为页面上的无限滚动实现了这段jquery代码：

paginate = function() {
  if ($('.pagination').length) {
    $(window).scroll(function() {
      var url;
      url = $('.pagination a.next_page').attr('href');
      if (url && $(window).scrollTop() > $(document).height() - $(window).height() - 50) {
        $('.loader').removeClass('hidden');
        return $.getScript(url);
      }
    });
    return $(window).scroll();
  }
};

$(document).on("page:load ready", paginate);

问题是，当调用这个函数时，我在developer_tools/network 2中看到了对同一url的get请求，这是随机发生的，可能是1个请求，也可能是2个请求

---

几天内都找不到解决方案。非常需要帮助。

嗯，在加载脚本之前，理论上可以多次触发scroll事件。解决这一问题的一种方法是：

paginate = function() {
  if ($('.pagination').length) {
    $(window).scroll(scrollHandler);
    return $(window).scroll();
  }
};

scrollHandler = function() {
  var url;
  url = $('.pagination a.next_page').attr('href');
  if (url && $(window).scrollTop() > $(document).height() - $(window).height() - 50) {
    $('.loader').removeClass('hidden');
    $(window).unbind('scroll');
    return $.getScript(url, function() {
      $(window).bind(scrollHandler);
    });
  }
};

---

这背后的想法是在请求脚本时解除滚动事件的绑定，一旦加载脚本，就重新绑定它。

找到一个工作示例，每次发送一个get请求

咖啡脚本：

onEndless = ->
  url = undefined
  $(window).off "scroll", onEndless
  url = $(".pagination a.next_page").attr("href")

  if url and $(window).scrollTop() > $(document).height() - $(window).height() - 150
    $(".loader").removeClass "hidden"
    $.getScript url, ->
      $(window).on "scroll", onEndless

  else
    $(window).on "scroll", onEndless

$(window).on "scroll", onEndless
$(window).scroll()

var onEndless;

onEndless = function() {
  var url;
  $(window).off('scroll', onEndless);
  url = $('.pagination a.next_page').attr('href');
  // $('.pagination').hide();
  if (url && $(window).scrollTop() > $(document).height() - $(window).height() - 150) {
    $('.loader').removeClass('hidden');
    return $.getScript(url, function() {
      return $(window).on('scroll', onEndless);
    });
  } else {
    return $(window).on('scroll', onEndless);
  }
};

$(window).on('scroll', onEndless);

$(window).scroll();

JS:

onEndless = ->
  url = undefined
  $(window).off "scroll", onEndless
  url = $(".pagination a.next_page").attr("href")

  if url and $(window).scrollTop() > $(document).height() - $(window).height() - 150
    $(".loader").removeClass "hidden"
    $.getScript url, ->
      $(window).on "scroll", onEndless

  else
    $(window).on "scroll", onEndless

$(window).on "scroll", onEndless
$(window).scroll()

var onEndless;

onEndless = function() {
  var url;
  $(window).off('scroll', onEndless);
  url = $('.pagination a.next_page').attr('href');
  // $('.pagination').hide();
  if (url && $(window).scrollTop() > $(document).height() - $(window).height() - 150) {
    $('.loader').removeClass('hidden');
    return $.getScript(url, function() {
      return $(window).on('scroll', onEndless);
    });
  } else {
    return $(window).on('scroll', onEndless);
  }
};

$(window).on('scroll', onEndless);

$(window).scroll();

---

几乎在那里，当我向下滚动到底部时，它会发送一个get请求，但当我继续向下滚动时，它不会再发送任何请求。它只调用paginate函数一次，而我100%确定还有更多的页面要加载。根据您的答案更新的javascript如下所示：找到了一个工作示例，非常感谢您的时间+1完全没有问题。：）请记住，您现在在每个卷轴上取消绑定并重新绑定活动，这在性能方面非常昂贵，可能会降低您的网站速度。好吧@MartinDenk，我仍然愿意接受更好的想法。：）因此，如果您对这段代码有一些改进，请毫不犹豫地将它们写在您的答案中，我将欣然接受。我是js中的noob，这就是为什么绑定/解除绑定对我来说并不昂贵。