自動調整高度，以兒童的身高（jQuery的）

Question

我有一個HTML代碼：

<pre><div class="post" style="border-width:1px;border-style:solid"> 
<div class="userpic" style="width:70px;float:left"> 
    <img src="XXX"><br>some text 
</div><!-- /userpic --> 
<span class="text"><h4>I'm a heading</h4>Just a few words.</span> 
</div><!-- /post --> </pre> 

有時在userpic-DIV加載picure比文本跨距中的文本更高。然而，後div，保持高度的文字是。現在我希望它至少和userpic-div一樣高。我試圖用jQuery做到這一點，這是我的想法：

$(document).ready(function() { 
    var elements = $('.post'); 
    elements.each(function(){ 
    userpic = $(this).children('.userpic'); 

     if($(this).height() < userpic.height()){ 
     $(this).height() = userpic.height(); 
      } 
    }); 

}); 

我得到沒有錯誤（在Chrome中），但它不起作用。

我做錯了什麼？

Answer 1

您已經將內容從流中提取出來。您需要清除浮動才能恢復正常的內容流。嘗試將<br style="clear: both" />添加到您的代碼中，在更多文本之後。

<pre><div class="post" style="border-width:1px;border-style:solid"> 
<div class="userpic" style="width:70px;float:left"> 
    <img src="XXX"><br>some text 
</div><!-- /userpic --> 
<span class="text"><h4>I'm a heading</h4>Just a few words.</span> 
<br style="clear: both;" /> 
</div><!-- /post --> </pre> 

Answer 2

您不能設置在jQuery的元素的height與height() = someValue。實際上，在=運算符的左側進行函數調用是毫無意義的。

改變這一行：

$(this).height() = userpic.height(); 

這樣：

$(this).css({height: userpic.height()});