Jquery帮助需要Div的高度

Jquery Help Need For Div Height

本文关键字:高度 Div 帮助 Jquery      更新时间:2023-09-26

我试图获得我的div的自动高度,通常div框的设置通过CSS 160px,但溢出:隐藏;如何通过jquery检查自动高度是否大于160px ?

我需要这个,因为我有一个框,我有一个按钮显示更多或显示更少,所以如果高度不大,那么通常高度160px来传递命令…现在它让我的方框变小了

我的代码是:

<script type="text/javascript">
 $("#Show_More_Websites").click(function() {
  var Button_Value = $("#Show_More_Websites").attr("value");
  var Box_Height   = $('.Box_Show_Websites').outerHeight();
  if(Button_Value == "Show More") {
   if(Box_Height <= "160") {
    var el = $('.Box_Show_Websites'),
    curHeight = el.height(),
    autoHeight = el.css('height', 'auto').height();
    el.height(curHeight).animate({height: autoHeight}, 500);
   }
   $("#Show_More_Websites").attr('value', 'Show Less');
  }
  if(Button_Value == "Show Less") {
   var el = $('.Box_Show_Websites'),
   curHeight = el.height(),
   autoHeight = el.css('height', '160px').height();
   el.height(curHeight).animate({height: autoHeight}, 500);

   $("#Show_More_Websites").attr('value', 'Show More');
  }
 });
</script> 

更新

在这里你可以找到我的代码:http://jsfiddle.net/rAjBH/

解决方案

demo fiddles - 注意:下面的提琴只改变了html部分,以增加使用html <br/>

的自动高度

http://jsfiddle.net/rAjBH/1/- autoHeight
http://jsfiddle.net/rAjBH/2/- auto height>

 $(document).ready(function() {
 $("#Show_More_Websites").click(function() {
  var Button_Value = $("#Show_More_Websites").attr("value");
  var el = $('.Box_Show_Websites')
  var Box_Height   = el.outerHeight();
  var autoHeight =  el.css('height', 'auto').height();
  el.css('height',Box_Height+'px');
  if(Button_Value == "Show More") {
    if(autoHeight > Box_Height) {
      el.height(curHeight).animate({height: autoHeight}, 500);
    }
    $("#Show_More_Websites").attr('value', 'Show Less');
  }
  if(Button_Value == "Show Less") {
    curHeight = el.height();
    autoHeight = el.css('height', '160px').height();
    el.height(curHeight).animate({height: autoHeight}, 500);
    $("#Show_More_Websites").attr('value', 'Show More');
  }
});
});