首頁  >  效果  > toggle([s],[e],[fn])

返回值:jQuery toggle([speed],[easing],[fn])

概述

用於繫結兩個或多個事件處理器函式,以響應被選元素的輪流的 click 事件。

如果元素是可見的,切換為隱藏的;如果元素是隱藏的,切換為可見的。

1.9版本 .toggle(function, function, … ) 方法刪除,jQuery Migrate(遷移)外掛可以恢復此功能。

參數

fn,fn2,[fn3,fn4,...] Function,.... V1.0 Removed 1.9

fn:第一數次點選時要執行的函式。

fn2:第二數次點選時要執行的函式。

fn3,fn4,...:更多次點選時要執行的函式。

[speed] [,fn] String,Function V1.0

speed: 隱藏/顯示 效果的速度。預設是 "0"毫秒。可能的值:slow,normal,fast。"

fn:在動畫完成時執行的函式,每個元素執行一次。

[speed], [easing ], [fn ] String,String,Function V1.4.3

speed: 隱藏/顯示 效果的速度。預設是 "0"毫秒。可能的值:slow,normal,fast。"

easing:(Optional) 用來指定切換效果,預設是"swing",可用參數"linear"

fn:在動畫完成時執行的函式,每個元素執行一次。

switch Boolean V1.3

用於確定顯示/隱藏的開關。如:true - 顯示元素,false - 隱藏元素

示例

無參數描述:

對錶格切換顯示/隱藏

jQuery 程式碼:
$('td).toggle();

fn,fn2描述: Removed 1.9

對錶格的切換一個類

jQuery 程式碼:

$("td").toggle(
  function () {
    $(this).addClass("selected");
  },
  function () {
    $(this).removeClass("selected");
  }
);

speed 描述:

用600毫秒的時間將段落緩慢的切換顯示狀態

jQuery 程式碼:

$("p").toggle("slow");

speed,fn 描述:

用200毫秒將段落迅速切換顯示狀態,之後彈出一個對話方塊。

jQuery 程式碼:

$("p").toggle("fast",function(){
   alert("Animation Done.");
 });

switch參數描述:

如果這個參數為true ,那麼匹配的元素將顯示;如果false ,元素是隱藏的

jQuery 程式碼:
$('#foo').toggle(showOrHide);

//相當於
if (showOrHide) {
  $('#foo').show();
} else {
  $('#foo').hide();
}