обновить или запустить javascript при изменении размера окна

Я использую этот javascript, чтобы сделать два дочерних div одинаковой высоты в их родительском div:

$(function(){
var leftHeight = $('.leftblock').height();
var rightHeight = $('.rightblock').height();
if (leftHeight > rightHeight){ $('.rightblock').css('height', leftHeight); }
else{ $('.leftblock').css('height', rightHeight); }
});

Когда я изменяю размер окна, один из div снова становится намного длиннее, но теперь javascript больше не работает. Я снова поместил тот же скрипт в функцию изменения размера окна, и это решило проблему!

$(window).resize(function(){ // same script as above again });

Мой вопрос; есть ли более чистый способ, чтобы я мог просто использовать скрипт один раз, но обновить или снова запустить скрипт при изменении размера окна?


person Erwin van Ekeren    schedule 19.11.2014    source источник


Ответы (2)


Конечно, объявите функцию и используйте ее в обоих обработчиках:

function resizeDivs() {
    var leftHeight = $('.leftblock').height();
    var rightHeight = $('.rightblock').height();
    if (leftHeight > rightHeight){ $('.rightblock').css('height', leftHeight); }
    else{ $('.leftblock').css('height', rightHeight); }
}
$(resizeDivs);
$(window).resize(resizeDivs);
person Sacho    schedule 19.11.2014

Вы можете объявить функцию и вызывать ее, когда захотите.

Попробуйте использовать функцию:

function check(){
    var leftHeight = $('.leftblock').height();
    var rightHeight = $('.rightblock').height();
    if (leftHeight > rightHeight){ 
        $('.rightblock').css('height', leftHeight); 
    } else {
        $('.leftblock').css('height', rightHeight); 
    }
}

$(function(){
    check();//calling function on window load
    $(window).resize(function(){
        check();//calling function on window resize
    });
});
person Manwal    schedule 19.11.2014
comment
Я уже реализовал ответ Сачо, но ваш ответ тоже работает! Спасибо - person Erwin van Ekeren; 19.11.2014