Javascript jQuery将div的高度设置为'；动态高度'；另一个

我有两个div

  <div class="col-1"><p>Content</p></div>
  <div class="col-2"><img src="" alt="" /></div>

问题是col-1上没有设置高度。它的动态高度随着内容的增长而增长。因此，上面的代码不适用于它

有没有办法使用jQuery将col-2的最小高度设置为等于col-1的动态高度

$('.col-2').css({'minHeight': divHeight+'px'});

您可以将其放在回调中。因此，它在高度改变时执行。

---

这样

添加一个调整大小事件侦听器，当col-2调整大小时，触发一个函数来调整col-2

$(document).ready(function() {
    $('.tb-col1').resize(function(){
       var divHeight = $('.col-2').height(); 
       $('.col-2').css('minHeight', divHeight+'px');
    }
});

---

这对我来说很好，只是你的类名错了，类名应该是

.col-1

和

.col-2

：

$(document).ready(function() {
    var divHeight = $('.col-1').height(); 
    $('.col-2').css('min-height', divHeight+'px');
});  

这是你的电话号码

编辑-基于评论：
无需使用jquery即可完成所有这些操作

Flexbox（IE 8和9中不支持）-如果将flex应用于父div，它将使其所有子div的高度相等：

 .row{ display: flex;}  

表格-您可以为您的部门提供表格布局

.row {display: table; }

.row div { display: table-cell;}

---

首先，您需要修复jQuery代码中缺少“-”的类名

如果你想得到.col-1的高度，你可以用几种方法，我将在后面讨论

在此之前，在每种情况下，您都需要编写一个函数，给出.col-1高度和set.col-2

$(document).ready(function() {

    function set_heights(){
        var divHeight = $('.col-1').height(); 
        $('.col-2').css('min-height', divHeight+'px');
    }

});

然后只要在需要时调用函数

以下是一些不同的方法：

设置间隔或计时器，以便在需要的时间段内调用上述函数一次

setInterval(function(){  set_heights(); }, 100);

使用.col-1的调整大小事件。当col-1发生变化时调用上述函数

$('.col-1').resize(function(){
    set_heights();
});

使用绑定

记住！！！对于响应性强的设计，即使在调整窗口大小时，也需要调用上述函数

---

祝你好运

但不是在HTML代码中。在HTML中是

col-1

和

col-2

。你不认为这可能是真正的问题吗？你能拉小提琴吗？请注意，我们没有在.col上指定高度1@AlexZahir我添加了fiddle@AlexZahir这个div确实占据了整个高度，问题是图像，让我看看它为什么这样做，我会给你回复的，但是背景颜色设置在div上。我不希望图像拉伸。只需显示背景色，它不会这样做now@AlexZahir它确实显示了你的背景色，将其更改为其他颜色，你会清楚地看到它，例如

background:red$('.col-1').resize(function(){
    set_heights();
});