Javascript 页面完成后的元素高度

我有一个绝对

div

，还有一个父

div

。我如何基于绝对div定义父级的高度，知道我有需要一些时间才能加载的图像

CSS:

HTML:

---

不要在

$（文档）中运行代码。准备好（…）

使用：

$(window).load(function(){
  // Your code here
});

---

这将确保页面的资产已加载，包括图像。

忘记了！我已经尝试了很多时间

$（window）.ready（function（）{

；）请注意。请改用

.on（“load”，handler）

。

<div id="parent" style="height:[HEIGHT OF CHILDREN]">
    <div id="absolute1" class="absolute">
        [LOTS OF CONTENT WHICH MAKE A VARIABLE HEIGHT, INCLUDING IMAGES WHICH TAKE SOME TIMES TO LOAD HERE]
    </div>
    <div id="absolute2" class="absolute">
        [LOTS OF CONTENT WHICH MAKE A VARIABLE HEIGHT, INCLUDING IMAGES WHICH TAKE SOME TIMES TO LOAD HERE]
    </div>
</div>
<a href="#absolute1">SAMPLE LINK 1</a>
<a href="#absolute2">SAMPLE LINK 2</a>

jQuery(document).ready(function($) {
    $('a').bind('click', function(e) {
        var target = $(this).attr('href');

        if($(target).html() !== undefined ) {
            $('#parent').css({
                'height': $('#parent').find(target ).height(),
            })
        }

        e.preventDefault();
    });


    // The problem: height is not correct until image is loaded/in cache
    $('a[href="#absolute1"]').trigger('click');
});

$(window).load(function(){
  // Your code here
});