Javascript jQuery:.height（）在.ready（）中返回null，但在运行相同的代码控制台时它会工作

我正在尝试将高度分配给一个主div容器，以便只将滚动条分配给这个“rightContent”div

我所做的就是找到所有其他

DIV

的高度，然后用“

窗口

”高度减去这些DIV的高度，从而将高度赋予主DIV“rightContent”

但是我遇到了一个问题，我得到了所有“div”的高度，除了“.tabstripContainer”div，它是一个动态的

div

，它在运行时生成

我在“.ready（）”的页面末尾添加了下面的代码，但是当我运行代码时，它返回“

tabstripContainer=$（'.tabstripContainer'）.outerHeight（）；

”的“null”

以下是我运行代码时的输出：

===========================================================

但是当我在浏览器控制台中运行代码时，我得到了“

tabstripContainer=$（'.tabstripContainer'）.outerHeight（）；

”的正确值

以下是在浏览器控制台中运行代码时的输出：

==================================================================== 这是我的密码：

$(document).ready(function() {
    // -----------------------------------------------------
    // 100% height fill for splitter main window and panes [Master layout]
    // -----------------------------------------------------
    var bHeight = $('body').height(),
        wHeight = $(window).height(),
        headerHeight = $('header').outerHeight(),
        blueHeader = $('.blueHeader').outerHeight(),
        greyHeader = $('.greyHeader').outerHeight(),
        tabstripContainer = $('.tabstripContainer').outerHeight();

    changepush();
    $(window).resize(function() {
        wHeight = $(window).height();
        changepush();
    });

    function changepush() {
        if (wHeight >= bHeight) {
            var rightContent = wHeight - headerHeight - blueHeader - greyHeader - tabstripContainer;
            $('.rightContent').height(rightContent);

            alert("bHeight" + " > " + bHeight + " wHeight" + " > " + wHeight + " headerHeight" + " > " + headerHeight + " blueHeader" + " > " + blueHeader + " greyHeader" + " > " + greyHeader + " tabstripContainer" + " > " + tabstripContainer + " rightContent" + " > " + rightContent);
        }
    }
});

---

请建议！

我没有足够的声誉发表评论，因此不得不提供这一答案

---

您是否尝试过使用$（window）.load而不是$（document）.ready？前者在加载其他页面资产（例如图像）时触发，而后者将在DOM准备就绪时触发。

如果您在运行时创建内容，则需要等待直到发生这种情况。

document.ready

在浏览器解析完所有DOM后立即启动，但在其他脚本（如ajax调用等）之前启动

一种可能的解决方案是使用

setTimeout

延迟

change push（）

调用，或者在显示内容后调用该函数

另一个解决方案是在加载div内容后触发您自己的事件（即“contentLoaded”）

您可以尝试使用

window.load

而不是

document.ready

，这是在完成所有外部请求（IMG、帧等）后触发的事件

setTimeout引用：

---

jQuery自定义事件：

如果动态创建了

div

，则当您第一次查询其高度时，它可能不存在。请确保所显示的代码在创建元素的任何代码之后运行。