jquery - 等高列不添加填充

Question

我正在使用下面的代码来等于列高，但它没有计算其中的填充，因此文本从 div 中出来。

<script>
        $(document).ready(function(){
            //set the starting bigestHeight variable
            var biggestHeight = 0;
            //check each of them
            $('.equal').each(function(){
                //if the height of the current element is
                //bigger then the current biggestHeight value
                if($(this).height() > biggestHeight){
                    //update the biggestHeight with the
                    //height of the current elements
                    biggestHeight = $(this).height();
                }
            });
            //when checking for biggestHeight is done set that
            //height to all the elements
            $('.equal').height(biggestHeight);

        });
    </script>

Answer 1

尝试使用.outerHeight()

http://api.jquery.com/outerHeight/

• .height()= 高度
• .outerHeight()= 高度 + 填充 + 边框
• .outerHeight(true)= 高度 + 填充 + 边框 + 边距

如果您的元素中有图像，您应该等待图像已使用$(window).load()

    $(window).load(function(){ // wait for all content and images are loaded
        var biggestHeight = 0;
        $('.equal').each(function(){
            if($(this).height() > biggestHeight){
                biggestHeight = $(this).height();
            }
        });
        $('.equal').height(biggestHeight);
    });