javascript $(window).scroll() 在页面加载时触发

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/6452960/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 20:43:42  来源:igfitidea点击:

$(window).scroll() firing on page load

javascriptjqueryeventsscrolljquery-events

提问by Mild Fuzz

Is there a way to prevent $(window).scroll()from firing on page load?

有没有办法防止$(window).scroll()在页面加载时触发?

Testing the following code in Firefox 4, it fires even when I unplug the mouse.

在 Firefox 4 中测试以下代码,即使我拔下鼠标,它也会触发。

jQuery(document).ready(function($){    
$(window).scroll(function(){
                console.log("Scroll Fired");
    });
});

回答by Wladimir Palant

The scrollevent is unrelated to the mouse, it is called whenever a new document scrolling position is set. And arguably that position is set when the document loads (you might load it with an anchor after all), also if the user presses a cursor key on his keyboard. I don't know why you need to ignore the initial scrollevent but I guess that you only want to do it if pageYOffsetis zero. That's easy:

scroll事件与鼠标无关,只要设置了新的文档滚动位置,就会调用它。并且可以说该位置是在文档加载时设置的(毕竟您可能会使用锚点加载它),如果用户按下键盘上的光标键也是如此。我不知道为什么您需要忽略初始scroll事件,但我想您只想在pageYOffset为零时才这样做。这很容易:

var oldPageYOffset = 0;
$(window).scroll(function(){
  if (window.pageYOffset != oldPageYOffset)
  {
    oldPageYOffset = window.pageYOffset;
    console.log("Window scrolling changed");
  }
});

Note: MSIE doesn't have window.pageYOffsetproperty so the above will need to be adjusted. Maybe jQuery offers a cross-browser alternative.

注意:MSIE 没有window.pageYOffset属性,因此需要调整以上内容。也许 jQuery 提供了一种跨浏览器的替代方案。

回答by Mild Fuzz

This was the solution I went for. Any improvements gratefully received.

这是我寻求的解决方案。感谢您收到任何改进。

   var scroll = 0;
    $(window).scroll(function(){
                    if (scroll>0){
                    console.log("Scroll Fired");
                    }
                    scroll++;
    });

回答by Juan Mendes

The scroll event does not fire on every load, only when refreshing a page that was scrolled, or when navigating to an anchor directly.

scroll 事件不会在每次加载时触发,只有在刷新滚动的页面或直接导航到锚点时才会触发。

Many of the answers suggest ignore the first time it's called, which would ignore a valid scroll if the page doesn't get scrolled initially.

许多答案建议在第一次调用时忽略,如果页面最初没有滚动,则会忽略有效的滚动。

//Scroll the page and then reload just the iframe (right click, reload frame)


//Timeout of 1 was not reliable, 10 seemed to be where I tested it, but again, this is not very elegant.
//This will not fire initially
setTimeout(function(){
  $(window).scroll(function(){
     console.log('delayed scroll handler');
  }); 
}, 10); 

//This will fire initially when reloading the page and re-establishing the scroll position
$(window).scroll(function(){
  console.log('regular scroll handler');
});
div {  
  height: 2000px;
  border: 1px solid red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
</div>

回答by JaredM

This seems to have worked for me.

这似乎对我有用。

$(window).bind("load", function() {
    $(window).on("scroll", function () {
        console.log('scroll');
    });
});

回答by Gidon Wise

sure, don't load it until after the load. make it a call back for sleep for 500 millis.

当然,在加载之后才加载它。让它回调睡眠 500 毫秒。