Question

我正在使用这个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 });

我的问题;是否有更简洁的方法，所以我可以只使用一次脚本，但在窗口调整大小时再次刷新或触发脚本？

Answer 1

当然，声明一个函数并在两个处理程序中使用它：

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);

Answer 2

您可以声明功能并随时调用它。

尝试使用功能：

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
    });
});

在窗口调整大小时刷新或触发javascript

2 个答案: