jQuery高度问题（值）

我很新的jQuery（从字面上今天开始使用它），所以我打赌我错过了一些非常明显的东西。jQuery高度问题（值）

我正在使用VS 2010中的jQuery 1.5.2和ASP.NET 3.5。我试图动态地将一个div容器的高度设置为另一个div容器的高度。后者div增长以适应内容，并且我需要两者在高度上相等，否则它看起来很糟糕。

我曾尝试下面的代码中的Site.Master文件的标题：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     var newHeight = $("#content").height() + "px"; //Also tried without + "px" 
     $("#sidebar").height(newHeight); 
    }); 
</script>

这是做什么...。第一个div的顶部与第二个的底部呈现在一起;不过，我不太确定它们是否处于同一高度。

我现在在Firefox 10.0.2上使用它;我没有检查任何其他版本或浏览器。

任何帮助表示赞赏。

来源

2012-03-13 William Smith

使用cosole.log（）或警告（），什么是'newHeight'值（没有'px'，因为它不需要）？ – shaunsantacruz 2012-03-13 23:56:47

第一：.height使用没有“PX”

二：这个代码将设置#sidebar的高度等于＃内容的高度时，文档加载完全。

所以，如果你只是想这样做，这段代码应该足够了。

但是，如果元素的高度发生了变化（如使用ajax请求获取更多内容并将其设置为#content），则每次更改#content的高度时都必须调整#sidebar高度。

关于这些元素的位置的问题，应该是在你的CSS一些错误..讲讲他们的浮动性..

来源

2012-03-13 23:53:27

错误是我的CSS的组合，并且不知何故，我在我的代码中颠倒了“content”和“sidebar”的顺序。我可能试图聪明地处理那些通常会对我造成不利影响的事情。谢谢！ – 2012-03-14 19:01:24

不客气，@威廉史密斯 – 2012-03-15 03:18:04

这个工作对我来说：

<div id="content" style="float:left; width:100px; height: 200px; background: red;">This is the content</div> 
<div id="sidebar" style="float:left; width: 50px; background: blue;">This is the sidebar</div> 

$(document).ready(function() { 
    var newHeight = $("#content").height(); 
    $("#sidebar").height(newHeight); 
});

http://jsfiddle.net/K2fmT/

来源

2012-03-13 23:54:06

没有你的px，它没有任何问题。

您还可以使用jQuery的API，并尝试使用equalizeHeights()做到这一点就像这个例子：

How to use equalizeHeights

来源

2012-03-13 23:56:34 ChapMic