$ (окно) .resize(); не работает

Question

У меня есть следующие две функции, для которых требуется $(window).resize(); & $(document).ready();.

Я пытаюсь оптимизировать код и сделать короче, удалив дубликат $(window).resize(); & $(document).ready(); и показывать только один раз в файле и просто обернуть все функции, необходимые им в них.

Например,

function onResize(){ 

    //Grid system 
    var gridElement = $(".gridElement", "#grid3"); 
    function GalleryGrid() { 
     var grid3 = $('#grid3'); 
     var width = $(window).width(); 
     if (width < 1024 && width > 770) { 
     var grid1 = $('#grid1'); 
     var grid2 = $('#grid2'); 

     for (var i = 0; i < gridElement.length; i++) { 
      if (i < gridElement.length/2) { 
       grid1.append(gridElement[i]); 
      } else { 
       grid2.append(gridElement[i]); 
      } 
     } 
     } else { 
     grid3.append(gridElement); 
     } 
    } 

    //Full screen 
    function fullScreen() { 
     var newHeight = $("html").height() + "px"; 
     $(".fullscreen").css("height", newHeight); 
    } 
} 

$(document).ready(onResize); 
$(window).resize(onResize); 

Весь код обернут $(document).ready(function(){

Однако все мои попытки вокруг этого подхода ломает код, особенно Gridsystem ... она просто не работает, что я делаю неправильно?

Answer 1

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

Здесь вы, кажется, ошибаетесь, считая, что ваш запуск $ (окна) .resize ... после вызова $ (docyument) .ready ... ожидал бы до выполнения функции .ready() , но это не так. Код, который должен быть выполнен после того, как документ достигнет полностью загруженного состояния, должен перейти в параметр функции к $().

В принципе, вы хотите, чтобы положить событие назначения обработчика в функции .ready(), как это:

$(function() { 
    $(window).resize(onResize); 
});