# jQuery 事件 - toggle() 方法 ## 實例 切換不同的背景色： ``` $("p").toggle( function(){ $("body").css("background-color","green");}, function(){ $("body").css("background-color","red");}, function(){ $("body").css("background-color","yellow");} ); ``` ## 定義和用法 toggle() 方法用于綁定兩個或多個事件處理器函數，以響應被選元素的輪流的 click 事件。 該方法也可用于切換被選元素的 [hide()](/jquery/effect_hide.asp "jQuery 效果 - hide() 方法") 與 [show()](/jquery/effect_show.asp "jQuery 效果 - show() 方法") 方法。 ## 向 Toggle 事件綁定兩個或更多函數 當指定元素被點擊時，在兩個或多個函數之間輪流切換。 如果規定了兩個以上的函數，則 toggle() 方法將切換所有函數。例如，如果存在三個函數，則第一次點擊將調用第一個函數，第二次點擊調用第二個函數，第三次點擊調用第三個函數。第四次點擊再次調用第一個函數，以此類推。 ### 語法 ``` $(_selector_).toggle(_function1()_,_function2()_,_functionN()_,...) ``` | 參數 | 描述 | | --- | --- | | _function1()_ | 必需。規定當元素在每偶數次被點擊時要運行的函數。 | | _function2()_ | 必需。規定當元素在每奇數次被點擊時要運行的函數。 | | _functionN()_,... | 可選。規定需要切換的其他函數。 | ## 切換 Hide() 和 Show() 檢查每個元素是否可見。 如果元素已隱藏，則運行 show()。如果元素可見，則元素 hide()。這樣就可以創造切換效果。 ### 語法 ``` $(_selector_).toggle(_speed_,_callback_) ``` | 參數 | 描述 | | --- | --- | | speed | 可選。規定 hide/show 效果的速度。默認是 "0"。可能的值： 毫秒（比如 1500） "slow" "normal" "fast" | | callback | 可選。當 toggle() 方法完成時執行的函數。如需學習更多有關 callback 的知識，請訪問我們的 [Callback 函數教程](/jquery/jquery_callback.asp "jQuery Callback 函數")。 | ## 顯示或隱藏元素 規定是否只顯示或只隱藏所有匹配的元素。 ### 語法 ``` $(_selector_).toggle(_switch_) ``` | 參數 | 描述 | | --- | --- | | _switch_ |必需。布爾值，規定 toggle() 是否應只顯示或只隱藏所有被選元素。 `true` - 顯示元素 `false` - 隱藏元素 |