为什么此功能在页面加载时没有预期的行为？

Question

我有一个函数，使一组兄弟div具有相同的高度。 当DOM准备好了，我定义它，调用它，然后将其设置为每当被称为window是resiz版。

jQuery(function($){
    function rescaleStuff ( )
    {
        $('.children-have-equal-height').each(function(){
            var children = $(this).children();
            var numChildren = children.length;
            if (numChildren > 1) 
            {
                var firstChild = children.first();
                var maxHeight = firstChild.height();
                firstChild.siblings().each(function() { 
                    var thisHeight = $(this).height(); 
                    if (thisHeight > maxHeight) 
                        maxHeight = thisHeight;
                });
                children.height(maxHeight);
            }
        });
    }

    rescaleStuff();

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

当重新调整window大小调用rescaleStuff函数时，它的工作rescaleStuff非常好，但是在页面加载时，它不能正常工作。 由于某种原因，它计算的高度小于实际高度。 这是为什么？

另外，是否可以使我的程序更加紧凑，美观，可读，高效，聪明和可维护？ 我不这么认为。 ;）

Answer 1

采用：

$( window ).load(function() {
 ....
});

如果必须计算宽度/高度，则positions ... ready（）方法是不够的。 由于内容会影响高度和宽度，因此您必须等到整个内容（带有图像）加载完毕。