只有 $(window).scroll 中最顶层的代码在工作

Question

我在 $(window).scroll 中有一些代码可以检查元素是否可见，然后触发另一个函数。

但是，只有第一部分代码在触发。这两段代码本身都可以工作 - 如果我交换它们的顺序，则正确触发最上面的那一个。

我的代码如下：

$.fn.isOnScreen = function() {
 "use strict";
 var win = $(window), viewport = {
  top: win.scrollTop(),
  left: win.scrollLeft()
 }, bounds = this.offset();
 viewport.right = viewport.left + win.width();
 viewport.bottom = viewport.top + win.height();
 bounds.right = bounds.left + this.outerWidth();
 bounds.bottom = bounds.top + this.outerHeight();
 return !(viewport.right < bounds.left || viewport.left > bounds.right || viewport.bottom < bounds.top || viewport.top > bounds.bottom);
};

$(window).scroll(function() {
 "use strict";

 var load_more_results = $("#ajax-load_more_results").isOnScreen();
 if (load_more_results === true) {LoadMoreResults();}

 var load_more_staff = $("#ajax-load_more_staff").isOnScreen();
 if (load_more_staff === true) {LoadMoreStaff();}
});

我做错了什么？您只能从 $(window).scroll 触发一个事件吗？我假设不是。

Answer 1

已修复 - 答案非常简单。 JS 代码在我的中央 js 文件中，它在每个页面上都会触发。具有这些 ID 的 DIV 仅出现在某些页面上，如果 DIV 根本不存在，则代码失败。

我通过将这些事件仅移动到包含那些 DIV 的页面来解决它。感谢@t.niese 的 JSFiddle 让我意识到了这一点。

只有 $(window).scroll 中最顶层的代码在工作

Only the topmost code in $(window).scroll is working

javascript

jquery

scroll