Javascript IE和firefox在scroll（）上更新location.hash时的行为不可预测

我试图通过检查长滚动站点中当前活动的div来更新location.hash。这在chrome上运行良好，但在Firefox和IE上失败。我已经用console.log和 我可以在控制台中看到id，但一旦我尝试将其输入到位置散列中，页面上的滚动就会停止，或者不可预测地跳转

$(window).scroll(function () {
$('div').each(function(){
    if (
      $(this).attr('class')=='article' && $(this).offset().top < window.pageYOffset + 10 
    && $(this).offset().top + $(this).height() > window.pageYOffset + 10
    ) {
       window.location.hash = $(this).attr('id')
    }
});

});

$（窗口）。滚动（函数（）{
$（'div'）。每个（函数（）{
如果(
$（this.attr（'class'）=='article'和&$（this.offset（）.topwindow.pageYOffset+10
) {
window.location.hash=$（this.attr（'id'））
}
});
});

首先，您需要了解滚动事件每秒触发多次。将其与您用于搜索DOM的方法相结合。。。查找每个

div

，然后过滤所有那些

div

，寻找你想要的，并一秒钟多次这样做……你不必要地超载了浏览器

在这个简单的演示中滚动窗口，查看脚本的触发频率

如果要在DOM中重复搜索相同的元素，将它们缓存到变量中会大大提高性能。搜索DOM比搜索包含元素的缓存变量要昂贵得多

/* use jQuery selector that already filters out all the other `div` in page*/
var $articles= $('.article');
/* now use the variable inside your functions*/
$( window).scroll(function(){
    $articles.each(.....
    /* use the same cache principles for "$(this)" to help avoid needless function calls*/
})

现在真正重要的部分是你应该控制每秒需要检查的次数。在用户仍在滚动时多次更新散列并重载浏览器来执行此操作没有任何好处

这个对演示的修改只在用户300毫秒没有滚动时触发代码，这可能会增加到1/2秒甚至更多。它通过不断设置超时延迟来实现这一点

---

您现在应该能够将这些概念应用到您的代码中了

好的，对不起，我没有意识到我必须接受答案，现在就完成：）谢谢您的帮助！正如您所见，我的javascript经验有限。我可以看到fiddle中的checkDelay函数是如何工作的，但我不确定如何集成这两个函数。再次感谢charlietfl的帮助！我已经能够让这个工作，但网页仍然跳转在ie 9中，我发现这是因为我试图设置哈希到一个id存在于网页，所以这是混淆浏览器。我发现了这一点：但我遇到了哈希“未定义”的问题