Javascript：用户完成滚动后执行操作
我正在试图找到一种方法来做到这一点。 我有一个盒子列表，每个大约150px高。 我正在使用javascript（和jquery），并希望在用户向下滚动页面后，页面将自动滚动，以便框与页面的其余部分对齐（也就是说，如果用户滚动和y页面的位置不能被150整除，它将滚动到最近的点）。
现在，我现在知道我可以使用.scroll() jquery事件激活一个事件，我可以使用.scrollTop()将其移动到某一点。 但是用户移动滚动条的每个像素都会激活整个function。 那么有没有办法延迟function从触发直到用户没有滚动，如果他们应该再次开始滚动，该function将停止？
正如你已经在使用jQuery一样，看看Ben Alman的doTimeout插件 ，它已经处理了方法的去抖动 （这就是你所追求的）。
从他的网站无耻地偷走的例子：
$(window).scroll(function(){ $.doTimeout( 'scroll', 250, function(){ // do something computationally expensive }); });
这与ŠimeVidas的答案基本相同，但不太复杂：
var scrollTimeout = null; $(window).scroll(function(){ if (scrollTimeout) clearTimeout(scrollTimeout); scrollTimeout = setTimeout(function(){yourFunctionGoesHere()},500); });
500是延迟。 鼠标滚动应该没问题。
当然，在scroll事件的事件处理程序中，触发setTimeout 100或200毫秒之后。 让你在scroll事件处理程序中设置的setTimeout函数执行上面提到的定位逻辑。 还有滚动事件处理程序清除自己设置的任何超时。 这样，上次滚动事件触发时，setTimeout函数将完成，因为滚动事件尚未清除它。
代码：
var scrollTimeout = null; var scrollendDelay = 500; // ms $(window).scroll(function() { if ( scrollTimeout === null ) { scrollbeginHandler(); } else { clearTimeout( scrollTimeout ); } scrollTimeout = setTimeout( scrollendHandler, scrollendDelay ); }); function scrollbeginHandler() { // this code executes on "scrollbegin" document.body.style.backgroundColor = "yellow"; } function scrollendHandler() { // this code executes on "scrollend" document.body.style.backgroundColor = "gray"; scrollTimeout = null; }
这将是一个场景，其中vanilla JavaScript将是有用的。
var yourFunction = function(){ // do something computationally expensive } $(window).scroll(function(){ yfTime=setTimeout("yourFunction()",250); });