.toggle()

類別： 已棄用 > 已棄用 1.8 | 事件 > 滑鼠事件 | 已移除

.toggle( handler, handler [, handler ] )傳回： jQuery版本已棄用： 1.8，已移除： 1.9

說明： 將兩個或以上的處理常式繫結至配對的元素，以便在交替按一下時執行。

注意：此方法簽章已於 jQuery 1.8 中標示為不建議使用，並於 jQuery 1.9 中移除。jQuery 也提供名為 .toggle() 的動畫方法，用於切換元素的能見度。會觸發動畫或事件方法，視傳遞的引數組而定。

.toggle() 方法會繫結 click 事件的處理常式，因此適用於觸發 click 的規則也適用於此。

例如，考量 HTML

1
2
3
 
<div id="target">
  Click here
</div>

然後可以將事件處理常式繫結至 <div>

1
2
3
4
5
 
$( "#target" ).toggle(function() {
  alert( "First handler for .toggle() called." );
}, function() {
  alert( "Second handler for .toggle() called." );
});

當重複點選元素時，訊息會交替出現

呼叫 .toggle() 的第一個處理常式。
呼叫 .toggle() 的第二個處理常式。
呼叫 .toggle() 的第一個處理常式。
呼叫 .toggle() 的第二個處理常式。
呼叫 .toggle() 的第一個處理常式。

如果提供的處理常式超過兩個，.toggle() 會在所有處理常式間循環。例如，如果有三個處理常式，則第一個處理常式會在第一次點選、第四次點選、第七次點選等時呼叫。

.toggle() 方法提供方便性。手動實作相同的行為相對簡單，而且如果內建於 .toggle() 中的假設會造成限制，則可能需要這麼做。例如，如果將 .toggle() 套用於同一個元素兩次，無法保證 .toggle() 會正確運作。由於 .toggle() 內部使用 click 處理常式來執行工作，因此我們必須解除繫結 click 才能移除使用 .toggle() 附加的行為，如此一來其他 click 處理常式才不會受到波及。此實作也會在事件中呼叫 .preventDefault()，因此如果已在元素上呼叫 .toggle()，則不會遵循連結，也不會點選按鈕。

範例

切換表格儲存格的樣式。（不建議使用。請改用 .toggleClass()。）

1
2
3
4
5
6
7
 
$( "td" ).toggle(
  function() {
    $( this ).addClass( "selected" );
  }, function() {
    $( this ).removeClass( "selected" );
  }
);