jquery - 表示 if 语句中的隐藏/显示值

Question

当有一个使 div 隐藏或显示的切换时，我有一个脚本，使用 .hide 和 .show 当只有当显示 div 时才会发生 if 语句时，我需要制作另一个脚本。

这是脚本：

<script type="text/javascript">
  $(document).ready(function() {
  $('#click1').toggle(function(){
    $('#div1').show().animate({'height': '50%'}, 400);
  }, function(){
    $('#div1').animate({'height': '0px'}, 400).hide(0);
  });
  });
</script> 

我需要像这样添加一个 if 语句：

<script type="text/javascript">
  $(document).ready(function() {
  $('#click1').toggle(function(){
    if (div2==show)
    {
      $('#div2').animate({'height': '0px'}, 400).hide(0);
    }
    $('#div1').show().animate({'height': '50%'}, 400);
  }, function(){
    $('#div1').animate({'height': '0px'}, 400).hide(0);
  });
  });
</script> 

谢谢

Answer 1

visibility根据@mplungjan和0 height@Frexuz 的建议，更新了要处理的代码：

var div2 = $('#div2');
if (div2.is(':visible') && div2.height() > 0) {
    $('#div2').animate({'height': '0px'}, 400).hide(0);
}

Answer 2

您想在显示一个 div 的同时隐藏另一个 div，对吗？

无需添加 if 语句，只需.content为所有内容 div 设置一个类并将其隐藏即可。

*您也可以使用slideUpandslideDown来代替动画。

查看 DEMO http://jsfiddle.net/yeyene/8JQXB/1/

查询

$(document).ready(function () {
    $('.link').on('click', function () {
        $('.content').slideUp(500);
        $('div#' + $(this).attr('target')).css({
            'height': '50%'
        }).slideDown(500);
    });
});

HTML

<a class="link" target="div1">Click1</a><br />
<div id="div1" class="content">Div 1 content</div>
<a class="link" target="div2">Click2</a><br />
<div id="div2" class="content">Div 2 content</div>
<a class="link" target="div3">Click3</a><br />
<div id="div3" class="content">Div 3 content</div>