Jquery检测滚动一次

Question

我听说可以使用以下代码检测滚动：

$('window').one('scroll', function() {  } );

如果有这样的内联代码：

var TimeVariable=setInterval(function(){ DoJQueryStuff() },300);

function DoJQueryStuff()
 {
 if(typeof jQuery == "undefined") return;
 window.clearInterval(TimeVariable);
 $('body').one('mousemove', function() { alert('mouse'); } );
 $('window').one('scroll', function() { alert('scroll'); } );
 }

DoJQueryStuff会每300毫秒调用一次，直到加载JQuery。 如果我将鼠标移动到屏幕上的任何位置，我会收到“mouse”警报。 如果我向下滚动，则不会收到“scroll”警报。 也就是说，它没有触发。

非常感谢您的帮助。

大卫

- Cymro

---

与其每隔300毫秒检查一次jQuery是否加载完成，不如将该函数添加到ready函数中，这样可行吗？ $(document).ready(function() { do stuff }); - Kyle

Kyle，如果没有加载Jquery，$(document)会导致错误。现在谷歌建议我们在页面加载后再加载jquery。能否提供一个你的想法的例子？ - Cymro

Answer 1

首先请使用jquery的readyhttp://api.jquery.com/ready/方法。我不想说你的实现是错误的，但比起jquery的ready方法它更慢。

你的滚动函数基本上没有执行，因为你将其绑定到了错误的对象上。 当你用jquery引用window对象时，不要用单引号括起来。

如果这样做，jquery将会调用document.getElementsByTagName，并且找不到标签名为window的元素，因为window不是window.document节点的子节点。因此，你的滚动检测函数从未被触发，因为jquery无法将eventListener绑定到你提交的元素标签上。

简单地将其绑定到window而不使用单引号。这将强制jquery直接将滚动事件绑定到window DOM对象，从而使你的函数在滚动时正确触发。

示例：

$(window).ready(function(){
    $(this).one('mousemove', function() { 
        // mouse move
    }).one('scroll', function(){
        // scroll 
    });
});

- ins0

---

Google 告诉我们在页面加载完成后再加载 jQuery。这就是我正在做的事情。然后我设置了一个定时器来检查 jQuery 是否已经被加载。我检测鼠标移动或滚动以加载外部 js 文件。为什么我的滚动检测必须放在 ready 函数中？ - Cymro

我更新了我的解释 - 希望现在更易理解。 - ins0

当您加载jQuery时，可以使用onload函数运行任何依赖于它的代码。如果您正在使用库，则应该有一种方法来添加onload函数。如果没有，您可以使用<script onload="...">。 - mcrumley