объединить onLoad, OnResize и onRefresh в jquery

#javascript #jquery #html #load #refresh

#javascript #jquery #HTML #загрузить #обновить

Вопрос:

Я хочу, чтобы веб-сайт выполнял определенный скрипт jquery (который позволяет мне увеличивать высоту вертикального меню до высоты окна моего браузера) при загрузке страницы и при ее изменении.

Итак, я написал jquery такого рода:

 jQuery(document).ready(function ($) {
$(window).on('resize', function() {
<code to execute>
}).trigger('resize');
});
  

Моя проблема в том, что этот код хорошо работает, когда кто-то загружает страницу или изменяет ее размер, но он не работает, когда кто-то нажимает кнопку обновления. Как я мог бы заставить код работать и в этом случае?
Заранее благодарю вас за помощь.

Ответ №1:

Попробуйте это:

 var myFn = function() { console.log('hello world') };

jQuery(document).ready(function ($) {
  myFn();
  $(window).on('resize', function() {
    myFn();
  });
});
  

Комментарии:

1. Обратите внимание, что вы, вероятно, не хотите загрязнять глобальное пространство имен здесь, но это всего лишь простой пример.

2. Спасибо, @glortho. В принципе, это работает, но не работает с моим скриптом. Это как если бы было слишком много переменных. Например, если я напишу весь скрипт и в конце выдам предупреждение, предупреждающее сообщение будет работать только при загрузке, а не при загрузке. Если я пишу только одну переменную, она работает хорошо; если я добавляю еще одну переменную, даже без каких-либо вычислений, событие изменения размера перестает работать. Кто-нибудь может мне помочь ?!?

Ответ №2:

 jQuery(document).ready(function ($) {
    function Resize(){
        $(window).on('resize', function() {
            <code to execute>
        }).trigger('resize');
    }
});
  

вызывайте это Resize() всякий раз, когда вам нужно. Либо при загрузке, либо при нажатии.

Ответ №3:

Оказалось, что способ, который я описал в своем собственном вопросе, был более чем правильным. Таким образом, он отлично работал, даже onRefresh. Что не позволяло моему скрипту работать должным образом, так это тот факт, что одна из переменных, которые я использовал, изменялась после завершения загрузки страницы, поэтому, когда я нажимал «обновить», она выдавала другое значение, чем в начале. Таким образом, для каждого пользователя stackoverflow.com , пожалуйста, обратите внимание, что всякий раз, когда вы хотите установить событие onLoad, OnResize И onRefresh, самый простой и наилучший из возможных способов:

 jQuery(document).ready(function ($) {
$(window).on('resize', function() {
<code to execute>
}).trigger('resize');
});
  

На самом деле, то, что предлагал глортхо, могло бы сработать, но для этого использовалась другая переменная, и, по моему скромному мнению, это сделало бы все это немного более избыточным.
Спасибо всем за вашу помощь и за чтение.