首頁 > web前端 > js教程 > 主體

jQuery很實用的事件toggle()方法詳解

黄舟
發布: 2017-06-26 13:32:50
原創
1444 人瀏覽過

實例

切換不同的背景色:

$("p").toggle(
  function(){
  $("body").css("background-color","green");},
  function(){
  $("body").css("background-color","red");},
  function(){
  $("body").css("background-color","yellow");}
);
登入後複製

親自試一試

#定義和用法

toggle() 方法用於綁定兩個或多個事件處理函數,以回應被選元素的輪流的click 事件。

此方法也可用來切換被選元素的 hide() 與 show() 方法。

向 Toggle 事件綁定兩個或更多函數

當指定元素被點擊時,在兩個或多個函數之間輪流切換。

如果規定了兩個以上的函數,則 toggle() 方法將切換所有函數。例如,如果存在三個函數,則第一次點擊將呼叫第一個函數,第二次點擊呼叫第二個函數,第三次點擊呼叫第三個函數。第四次點擊再次呼叫第一個函數,以此類推。

語法

$(selector).toggle(function1(),function2(),functionN(),...)
登入後複製

親自試一試

##function1()必要。規定當元素在每偶數次被點擊時要運行的函數。 function2()必要。規定當元素在每奇數次被點擊時要運行的函數。
#參數描述

functionN()

,...

#可選。規定需要切換的其他函數。

切換 Hide() 和 Show()檢查每個元素是否可見。 如果元素已隱藏,則執行 show()。如果元素可見,則元素 hide()。這樣就可以創造切換效果。 語法
$(selector).toggle(speed,callback)
登入後複製
親自試一試可能的值:毫秒(例如1500)##"normal"

#參數

描述
  • ##speed

  • 可選。規定 hide/show 效果的速度。預設是 "0"。

"slow"

"fast"

callback
可選。當 toggle() 方法完成時執行的函數。 如需學習更多關於 callback 的知識,請造訪我們的 Callback 函數教學。
顯示或隱藏元素規定是否只顯示或只隱藏所有符合的元素。

語法