Привязать функцию к изменению размера окна и прокрутке окна, но также немедленно вызвать ее

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(function() {
    $(window).on('resize scroll', reposition).trigger('scroll');
});

Таким образом, вы гарантированно, что DOM будет готов для вас возиться с