除非我“检查页面”，否则不会设置高度答案

【问题标题】：height not being set unless I "inspect page"除非我“检查页面”，否则不会设置高度
【发布时间】：2012-02-23 05:58:32
【问题描述】：

由于某种原因，这在页面首次加载和内容调整大小时有效，如果我在 chrome 中执行“检查元素”，它只会运行“matchColumns”。似乎无法理解为什么它会这样做，而不是每次内容更改时都会更改。 Here 是我正在使用的网站。提前致谢。

var $j = jQuery.noConflict();

$j(document).ready(function() {
    MC.general.init();
    MC.homeSlider.init();
    MC.homeMap.init();
    $j(window).resize(function() {
      $j('#layer-base, #layer-top, .exposed, ').matchColumns();
    }); 
});

$j.fn.matchColumns = function(){
    var height_tar = $j(document).height();
    $j(this).css({"height": (height_tar ) + "px"});
}; // matchColumns

【问题讨论】：

它似乎对我有用，但是我只尝试在 matchColumns() 一侧添加断点，您确定它不起作用但没有出现预期的效果吗？您是否尝试过添加 consonle.log('matchColumns ran'); 之类的内容来确保？
如果要检查每次内容变化时，应该绑定change事件。调整大小是......好吧 - 当浏览器窗口改变大小时调整大小
我认为这更多地与使用 $(document).height() 而不是 $(window).height() 有关，据我所知，文档高度不会在调整大小时发生变化。
我在设置“height_tar”后发出警报，除非我在 Chrome 中打开检查元素，否则它会一直保持在 643，然后在打开正确的内容时它会变为 840。

标签： jquery html resize height

【解决方案1】：

Inspecting 会在 Chrome/Safari 中打开 Web Inspector 或在 Firefox 中打开 Firebug，这会占用视口的一部分并触发窗口调整大小事件（即使就操作系统而言，窗口没有改变大小，从您的文档的观点）。

除了在调整大小时触发的调用之外，我还会添加一个立即运行的 matchColumns 调用。比如：

$j(window).resize(function() {
  $j('#layer-base, #layer-top, .exposed, ').matchColumns();
}); 
$j('#layer-base, #layer-top, .exposed, ').matchColumns();

或者更好的是，将该行分解为一个函数。

【讨论】：