将函数绑定到窗口调整大小和窗口滚动,但也立即调用它

Question

因此,在网页上,只要重新调整大小或滚动浏览器窗口,就必须重新定位一些组件.

$( window ).on( 'resize scroll', reposition );

这样reposition做的功能在哪里.

但是,必须立即调用该函数.(通过立即,我的意思是页面初始化 - 在DOM-ready内部.)需要这样做来设置组件的初始位置.

我现在这样做:

$( window ).on( 'resize scroll', reposition );
reposition();

我注意到这也有效:

$( window ).on( 'resize scroll load', reposition );

我相信这是可靠的 - load在DOMContentLoaded活动之前永远不会被解雇.

但这会延迟执行,直到所有页面资源都被加载(这可能需要几秒钟,具体取决于页面上有多少图像).有没有办法告诉jQuery也应该立即调用绑定函数？

喜欢:

$( window ).on( 'resize scroll now', reposition );

要么

$( window ).on( 'resize scroll ()', reposition );

这些例子当然是无效的,但我想知道jQuery的on方法是否具有这样的功能.我想,我可以手动实现这个功能on,但我想首先检查它是否已经...

Answer 1

你可以这样做:

$(window).on('resize scroll', reposition).trigger('scroll');

设置和触发事件回调.

虽然你应该在$(document).ready中设置它,但这只是为了安全起见.基本上你的代码应该是这样的:

$(document).ready(function() {
    $(window).on('resize scroll', reposition).trigger('scroll');
});

因此,您可以保证DOM可以随时使用