jquery切换slideUp / slideDown

Question

我有一个div＃项目，如果点击它，那么div＃choices slideDown（）。如果它再次被点击，那么div＃choices应该是slideUp（）;我如何测试选择是否已经减少或增加？我知道我可以存储一个变量并在点击div＃项时切换它的值，但是如果#choices被其他方式滑落了怎么办？

Answer 1

使用.slideToggle（）

Answer 2

正如Marimuthu's answer指出的那样，如果div已经打开，您可以使用slideToggle()向上滑动，如果div已经关闭，则可以向下滑动。

您还可以查看display属性，了解它是否可见。来自 slideUp（）的jQuery文档。

  

一旦高度达到0，显示样式属性将设置为none，以确保该元素不再影响页面布局。

了解这一点，您可以检查它是否设置为“无”：

var $choices = $('div#choices');
if ($choices.css("display") == "none")
    $choices.slideDown();
else
    $choices.slideUp();

Answer 3

试试这个 -

的 HTML：

<a href="#demo" class="nav-toggle">Show</a>
<div id="demo" style="display:none;">
<p>short info</p>
</div>

JQUERY SCRIPT：

$('.nav-toggle').click(function(){
   var content_id = $(this).attr('href');               
   var toggle_switch = $(this); 
     $(content_id).toggle(function(){
    if($(this).css('display')=='none'){
          toggle_switch.html('Show');
    }else{
      toggle_switch.html('Hide');
        }
    });  
});