Question

我有以下功能，其中我有三列。 javascript应找到最大的列，并将其他列的高度设置为该高度。

$(document).ajaxComplete(function(){
    function fixScheduleHeights(){
        content1 = $('.schedule_content_holder').first();
        content2 = content1.next();
        content3 = content2.next();

        content1Height = content1.height();
        content2Height = content2.height();
        content3Height = content3.height();

        biggestScheduleHeight = Math.max(content1Height, content2Height, content3Height);

        $('.schedule_content_holder').height(biggestScheduleHeight);
    }
    fixScheduleHeights();
});

我尝试了上面的代码，如果最大的列是第一列，它就可以工作。如果最长的列是第二列，则它不起作用。我将以下代码用于调试目的：

alert(content2height);

并且它提醒了16的值，它不应该是content2height的值。在查看检查器之后，我发现问题是body的css属性为line-height：16px;

为什么content2Height = 16，如何更改它以使其等于实际高度？

Answer 1

有一种更简单，最健壮的方式来做你正在做的事情，这不依赖于你的列的位置或数量，因为我认为你对.next()的调用没有返回你认为他们的'重新回来。 next()返回DOM树中的下一个兄弟（可选择由选择器过滤，而您不提供一个）。您可以返回<br />，<span>或其他任何内容。

$(document).ajaxComplete(function(){
    var $columns = $('.schedule_content_holder');
    var maxHeight = 0;

    $columns.each(function() {
         maxHeight = Math.max(maxHeight, $(this).height());
    });

    $columns.height(maxHeight);
});

jquery height（）方法返回行高

1 个答案: