相同高度的盒子在刷新后立即生效

Question

我将此脚本用于相同的框高度

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.2.min.js">
$(document).ready(function(){

    var highestBox = 0;
        $('.box').each(function(){  
                if($(this).height() > highestBox){  
                highestBox = $(this).height();  
        }
    });    
    $('.box').height(highestBox);

});
</script>

但实际上它的工作原理有点奇怪。首先它从数据库加载数据，然后它应该这样做，但事实并非如此，所以我需要刷新页面以获得我在页眉中使用它的效果，就像在页脚中一样。没有改变任何建议我做错了什么？页面是 matus-satara.com 你可以实时查看:)

Answer 1

您不能在同一个脚本标签中同时包含 src 和实际内容。

像这样分隔脚本：

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.2.min.js"></script>
<script>
$(document).ready(function(){

    var highestBox = 0;
        $('.box').each(function(){  
                if($(this).height() > highestBox){  
                highestBox = $(this).height();  
        }
    });    
    $('.box').height(highestBox);

});
</script>

Answer 2

如果不需要支持IE9，给父容器设置样式display: flex，让所有子容器长到一样高。 http://caniuse.com/#feat=flexbox

相同高度的盒子在刷新后立即生效

Same height of boxes works just after refresh

jquery

css

height

refresh

box