javascript - 奇怪的div高度错误: webkit or jQuery bug?

Question

我有一个简单的网页应用程序，它有两个并排的 float 内容 div。

一小段jquery通过查看父div的高度并进行简单的计算来设置这些div的高度

这种方法在 Firefox 和 IE 中效果很好......而且它第一次在 Safari 和 Chrome 中也有效......

但是当页面在 Safari 或 Chrome 中重新加载时..左右 div 的高度会无缘无故地神奇地增加约 200px。

进行硬刷新..并且 div 高度恢复正常

请多多指教!这很奇怪 -

<div class="holder1"  > 

<!--      LEFT HAND BOX     --> 

<div id="left-box" class="half left"> 
<div class="info-box">  
<h2>Left Hand Content</h2>  


 ------------- Left content here----------------------

</div>  
</div> 

<!--      RIGHT HAND BOX     -->

<div id="right-box" class="half right" >
<div class="info-box">  
<h2>Right Hand Content</h2> 

 -------------Right content here----------------------      

</div>      
</div> 

<div class="clearfix"></div>    
</div> 

<!--    END RIGHT and LEFT BOXES    -->

<div>   more content here  </div>

     <script language="javascript"> 
            var new_height =  $('#left-box').closest('.holder1').height() -25;
            $('#right-box').find('.info-box').height(new_height);
        $('#left-box').find('.info-box').height(new_height);

    </script> 

Answer 1

你确定 DOM 是在 javascript 运行时构建的吗？尝试一下

 <script type="text/javascript">
    $(function() {
        var new_height =  $('#left-box').closest('.holder1').height() -25;
        $('#right-box').find('.info-box').height(new_height);
        $('#left-box').find('.info-box').height(new_height);
    }
</script>