有效地收听JS .scroll（）

Question

我有一个可滚动的元素，其中包含许多子元素和一个带有相应选项的选择标签。

我想改变基于元素.scrollTop()

如何有效地做到这一点选择的价值？我想过将儿童的.offset().top存储在一个数组中，并循环遍历它。但是，浏览器不处理它。我可能会尝试创建一个.setTimeout()标志，但这看起来并不干净。

r = $('ul') 
    offsets = [] 
    r.find('li').each((index) -> 
     offsets[index] = $(this).offset().top 
    ) 
    r.bind('scroll', -> 
     // while loop checking .scrollTop() > offsets[n] is slow 
     // maybe spams to many .scroll events? 
    ) 

Answer 1

@osoner说的+而不是在滚动偶处理程序中进行所有计算，在间隔后触发处理程序中的另一个事件（例如，'fooscroll'），然后您将所有子元素订阅到事件，并根据您设置的条件自行更新。

var scrollTimer; 
$(window).on('scroll', function(e) { 
    if (scrollTimer) { clearTimeout(scrollTimer); } 
    scrollTimer = setTimeout(function() { 
     $(window).trigger('fooscroll'); 
    }, 200); 
}); 

$('li').on('fooscroll', function() { 
    // Check scrollTop or whatever... 
}); 

Answer 2

您应该阅读this suggestion from John Resig。基本上，每次用户滚动时都会设置一个标志，并使用检查此标志的间隔函数执行所需的操作。