1

我在 div 元素中使用来自 .each() 的代码，找到一个子元素，根据其内容设置高度（高级？） 它在页面加载时工作正常，但不适用于窗口调整大小请帮助

$('#col-main > div').each(function () {
    var tmpHeight = 0;
    $(this).find("h2").each(function() {
        tmpHeight = $(this).height() > tmpHeight ? $(this).height() : tmpHeight;
    });
    $(this).find("h2").height(tmpHeight);
});

从此代码在页面加载时添加工作代码我得到了更高的 div（列）“.demographcont”的高度在一行（“.box”）中，我将其设置为该行中的其他 div 以获得相同的高度“.demographcont”。它适用于所有行。 正常尺寸

不适用于窗口调整大小，重置高度，高度将根据内容来 窗口调整大小

在窗口调整大小时刷新页面后 在此处输入图像描述

/* code for adding height to div as per content */
    function setHeight() {
        $('.box').each(function () {
            var tmpHeight = 0;
            $(this).find(".demographcont").each(function () {
                tmpHeight = $(this).height() > tmpHeight ? $(this).height() : tmpHeight;
            });
            $(this).find(".demographcont").height(tmpHeight);
            // alert(tmpHeight);
        });
    }

    $(document).ready(function () {
        setHeight();
    });

    $(window).resize(function () {
        setHeight();
    });

html代码在这里

<div class="box clearfix">
    <div class="demographcont clearfix">
        <div class="grid_12">
            <div class="grid_5">
                <label>
                    Date of Birth:</label>
            </div>
            <div class="grid_7">
                18/06/2013
            </div>
        </div>
        <div class="grid_12">
            <p>
                content1</p>
        </div>
    </div>
    <div class="demographcont">
        <div class="grid_12">
            <p>
                content1</p>
            <p>
                content1</p>
            <p>
                content1</p>
            <p>
                content1</p>
        </div>
        <div class="grid_12">
            <p>
                content1</p>
            <p>
                content1</p>
            <p>
                content1</p>
            <p>
                content1</p>
        </div>
    </div>
</div>

.demographcont{ 边框：1px 实心 #006599; 填充：0；行高：20px；}

4

1 回答 1

1

好的，这就是我从你的问题中得到的：

您想找到 div.demographcont 元素的最大高度并为其余元素设置此值。页面加载后，我们将有类似这样的东西

<div class="box clearfix">
    <div class="demographcont" style="height:304px">...</div>
    <div class="demographcont" style="height:304px">...</div>
</div>

现在再次调整窗口大小时，你想做同样的事情，但正如我在评论中告诉你的那样，这是不可能的，因为你已经在内联设置了相同的高度。否则我没有得到你的问题。

所以尝试添加自动高度属性，然后做剩下的过程：

 function setHeight() {
    $('.box').each(function () {
        var tmpHeight = 0;
        $(this).find(".demographcont").each(function () {
        $(this).height('auto');
            tmpHeight = $(this).height() > tmpHeight ? $(this).height() : tmpHeight;
        });
        $(this).find(".demographcont").height(tmpHeight);
        // alert(tmpHeight);
    });
}
于 2013-07-23T21:42:37.347 回答