切換可能性

簡單的 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");  
}

以上所有例子都可以在這裡找到