当文档准备好时，我在内容div中加载了一个页面。但是，我也有一些链接，当用户点击它们时，它们会将不同的页面加载到同一个内容div中。我试图建立内容div的高度来控制其他东西，但是一旦在页面加载时设置了div的高度，我似乎无法获得新页面所在的内容div的新大小...
例如，加载的页面是6000px，第1页的高度是500px，第2页的高度是300px。当页面加载时，内容div设置为6000px。然而，当我单击第1页将其加载到内容div中时，内容div仍然设置为6000px，即使内容本身的高度只有500px，第2页也是如此，等等...
下面是html：

<div id="select">
    <div id="menu">
        <ul>
        <li><a class="load" href="javascript:void(0)" id="page1">page1</a></li>
        <li><a class="load" href="javascript:void(0)" id="page2">page2</a></li>
        </ul>
    </div>
</div>
<div id="spacer"></div>
<div id="content"></div>

下面是CSS：

#select { 
    width: 215px;
    top: 20px;
    left: 10px;
    position: absolute;
    }

#spacer {
    border-right:2px solid #000000;
    left:10px;
    width:215px;
    position: absolute;
    }

#content {
    left: 227px;
    top: 20px;
    width: 703px;
    padding: 0; 
    margin: 0;
    position: absolute;
    }

下面是我的jquery：

$(document).ready(function() {
    //Load content on page load
    $("#content").html('<ul><li>Loading Content...</li></ul>')
                 .load("/content/" + "projects.php", null, function() {
                            contentHeight = $("#content").height();
                            selectHeight = $("#select").height();
                            $("#spacer").height(contentHeight + "px")
                                        .css({"top": selectHeight + 40 + "px" });
                 });
    //Load content on click
    $(".load").click(function(){
                    loadName = $(this).attr("id");
                    $("#content").html('<ul><li>Loading Content...</li></ul>')
                                 .load("/content/" + loadName + ".php", null, function(){
                                    contentHeight = $("#content").height();
                                    selectHeight = $("#select").height();

                                    if(selectHeight < contentHeight) {
                                    $("#spacer").css({"top": selectHeight + 40 + "px", "display": "block" })
                                                .height(contentHeight + "px");
                                    }else{        
                                    $("#spacer").css({"display": "none"}); 
                                    return;
                                    }
                    });
    });
});