css - jQuery div.height 在 Chrome 中是错误的，以使所有 div 高度相同

Question

我使用以下代码使rightpos,leftpos和middleposdiv 具有相同的高度：

<script>

    jQuery.noConflict();
    jQuery(document).ready(function($){

        // Find the greatest height:
        maxHeight = Math.max($('#rightpos').height(), $('#middlepos').height());
        maxHeight = Math.max(maxHeight, $('#leftpos').height());

        // Set height:
        $('#rightpos').height(maxHeight);
        $('#middlepos').height(maxHeight);
        $('#leftpos').height(maxHeight);

    })
</script>

使用这种方式为http://yaskawa.ir/的主页确定最高 div在 Firefox 中效果很好，但在 Chrome 中存在问题。

---

Sparky672的回答后更新 1 ：

我可以看到，使用此代码，alert('test here');最后的 不起作用。

<script>
    jQuery.noConflict();
    //jQuery(document).ready(function($){});

    jQuery(window).load(function($){

        // Find the greatest height:
        maxHeight = Math.max($('#rightpos').height(), $('#middlepos').height());
        maxHeight = Math.max(maxHeight, $('#leftpos').height());

        // Set height:
        $('#rightpos').height(maxHeight);
        $('#middlepos').height(maxHeight);
        $('#leftpos').height(maxHeight);

        alert('test here');
    })
</script>

Answer 1

尝试window.load()代替document.ready()以确保在计算身高之前加载所有资产。

jQuery(window).load(function($){

文档：

当元素和所有子元素都已完全加载时，加载事件将发送到该元素。此事件可以发送到与 URL 关联的任何元素：图像、脚本、框架、iframe 和窗口对象。

http://api.jquery.com/load-event/

见演示：

http://jsfiddle.net/snBLP/3/

Answer 2

$(document).ready() 不适合计算高度。$(document).ready() 不等待图像加载等。

我建议尝试

$(window).ready() 

反而...