切换可能性

简单的 toggle() 案例

function toggleBasic() {
  $(".target1").toggle();
}

具体持续时间

function toggleDuration() {
  $(".target2").toggle("slow"); // A millisecond duration value is also acceptable
}

……和回调

function toggleCallback() {
  $(".target3").toggle("slow",function(){alert('now do something');});  
}

……或者缓和和回调。

function toggleEasingAndCallback() {
  // You may use jQueryUI as the core only supports linear and swing easings
  $(".target4").toggle("slow","linear",function(){alert('now do something');});  
}

……或者有多种选择**。**

function toggleWithOptions() {
  $(".target5").toggle(
    { // See all possible options in: api.jquery.com/toggle/#toggle-options
      duration:1000, // milliseconds
      easing:"linear",
      done:function(){
        alert('now do something');
      }
    }
  );  
}

也可以使用幻灯片作为带有 slideToggle() 的动画

function toggleSlide() {
  $(".target6").slideToggle(); // Animates from top to bottom, instead of top corner
}

…或通过 fadeToggle() 改变不透明度淡入/淡出

function toggleFading() {
  $( ".target7" ).fadeToggle("slow")
}

…或用 toggleClass() 切换类

function toggleClass() {
  $(".target8").toggleClass('active');
}

一个常见的情况是使用 toggle() 来显示一个元素而隐藏另一个元素(同一个类)

function toggleX() {
  $(".targetX").toggle("slow");  
}

以上所有例子都可以在这里找到