Javascript 如何将最小高度和最大高度设置为窗口高度

我可以将div height设置为minwindowheight，但不能以类似的方式将max height设置为windowHeight。这是密码

 $(document).ready(function() {   
     function setHeight() {
         windowHeight = $(window).innerHeight();
         $('.sidebar').css('min-height', windowHeight);   
     };   
     setHeight();
     $(window).resize(function() {
         setHeight();   
     }); 
 });

---

现在你不需要javascript来做这件事。纯CSS就足够了（只要

高度

就足够了，因为您希望将

最小高度

和

最大高度

设置为相同的值）：

vh

是指视口高度的相对单位。它甚至可以在调整窗口大小时工作。顺便说一句，同样适用于

vw

，它是视口的宽度

---

如果你想让最小高度和最大高度都是窗口的大小，为什么不放弃最大和最小高度，直接设置高度本身呢？？你的代码非常棒，但是我会用不同的结构。您正在加载jQuery库吗

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

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

function setHeight() {
    windowHeight = $(window).innerHeight();
    $('.sidebar').css('height', windowHeight);   
    console.log(windowHeight);
}

这将使侧边栏在加载和调整屏幕大小时达到屏幕高度的100%

或者，如果你想让一个页面成为一个平板电脑风格的web应用程序，你可以用css单独实现这个100%的边栏

html,body {
   width: 100%;
   height: 100%;
   overflow:hidden;
}
.sidebar {
   height: 100%;
   /*set overflow-x + y to scrolls if you have a lot of content*/
}

这将在不使用任何javascript/jquery的情况下提供相同的效果

你可以试试这个

$('.sidebar').css({
    "max-height": windowHeight+"px",
    "min-height": windowHeight+"px"
});   

---

演示

$（'.sidebar'）.css（'min-height'，windowHeight+'px'）您缺少单位。支持链接已添加到答案。使用
高度：100%
应该可以在这里使用。我不明白为什么我们应该使用
vh
单位。使用
高度：100%
要求您定义
html
和
body
的高度。视口单位是一件好事。+1现在对视口单位的支持很好。最后，没有必要污染从身体到侧边栏的每个子元素，高度为
100%
100vh可能比window大。例如，如果在safari mobile上查看，由于叠加的导航按钮，我有两个图像在里面。侧边栏一个在另一个下面，适合全视图高度。所以我希望这些img高度在窗口调整大小时将同样调整大小。我使用img{max height:50vh}来调整这些img，但有没有更好的方法？
$('.sidebar').css({
    "max-height": windowHeight+"px",
    "min-height": windowHeight+"px"
});