先前设置的Jquery高度不正确

Question

我已经做了一个单独的网站，我们正在加载到joomla网站通过iframe，但我想调整的高度容器的iframe。

因此，我尝试用下面的代码来检索我的html的高度，它工作得很好(从iframe内部调用)：

$(document).ready(function() {
    var height = $(document).height();
    alert( height );
});

在所有页面上都会正确地提醒高度。

当我调整iframe容器的高度时，问题就出现了。当我使用这段代码时：

$(document).ready(function() {
    var height = $(document).height();
    alert( height );
    parent.document.getElementById('blockrandom').style.height = height + 'px';
});

现在高度将与之前的高度相同或更大，因此当您从高度为900px的页面转到高度为500px的页面时，高度将保持为900px (在警报中也是如此)。从小到大都很好。

提前感谢！

Answer 1

是的，我发现一旦调整了高度，使用原生属性或jQuery就不会有任何不同，生成的高度值似乎不会反映设置的新值。因此，为了在相同的页面交互过程中动态调整元素，到目前为止，我不得不求助于高度启发式。

我最终评估了元素中的内容，并构造了一个可接受的、如果不是完全准确的代理高度值。例如，假设我有一个框，其中包含22个标签字段的原始集合。

当用户调整父值或选项时，我可能最终得到0到full 22之间的任意数量的结果字段。

因此，如果在某个用户事件后还剩下10个元素，我会运行一个函数来计算可见元素的总数并计算高度。因此，10个场x 22像素意味着我将包含的元素重新调整为大约220像素。

具体地说，我有一个抽象的函数，我在其中分配了一个默认高度、一个基本高度(它允许一些始终公开的不可调整元素，如文本/指令等)，以及元素高度乘数。

在加载时和事件之间，我将元素容器设置为默认高度。在对可变元素进行计数之后，我通过将可变元素乘以乘数并将其与基本高度相加来计算值。

到目前为止，这是我所能做的最好的事情，而且相当简单。使用jQuery选择器，只需要几行代码就可以计算高度，再多几行代码就可以计算和设置高度。

注意:值得注意的是，只有那些不会通过内容自动调整高度的元素才需要这样做。最大的问题是jQuery选项卡，在我的例子中，这个问题就是在这个选项卡上发生的。当元素在display = block||none之间切换时，大多数未处理的相对高度元素会自动调整其间距。

下面是一些示例代码：

setElemHeight = function(options) { 
    var _elem = options.containerElement;
    var _nBase = options.nBaseHeight;
    var _nMltplr = options.nMultiplierHeight;
    // COUNT ROWS
    var _nCnt = 0;
    $( '#' + _elem.id + ' div div:first-child  > input').each( function() { 
        if(this.style.display != 'none') _nCnt++; 
    });
    $(_elem).height(_nBase + (_nCnt * _nMltplr));
}

为了达到我的目的，我已经抽象了足够多的东西，但是您可以更进一步，这样选择器的子元素就是动态的。