在 jQuery 中,on() 函數是一個非常有用的函數,它可以綁定一個或多個事件和事件處理函數,這使得我們可以很方便地為 DOM 元素添加和移除事件。
下面是 jQuery 的 on() 支持的事件類型:
"click" // 單擊 "dblclick" // 雙擊 "mouseenter" // 鼠標移入 "mouseleave" // 鼠標移出 "hover" // 鼠標移入移出 "mousedown" // 鼠標按下 "mouseup" // 鼠標松開 "mousemove" // 鼠標移動 "keydown" // 按鍵按下 "keyup" // 按鍵松開 "keypress" // 按鍵按下松開 "blur" // 失去焦點 "focus" // 獲取焦點 "change" // 值改變 "submit" // 提交表單 "resize" // 改變窗口大小 "scroll" // 滾動 "contextmenu" // 右擊菜單 "load" // 加載完成 "unload" // 卸載 "error" // 錯誤
我們可以使用 on() 函數來為任何一個 DOM 元素綁定上述事件類型,例如:
$(document).ready(function(){ $("p").on("click", function(){ $(this).hide(); }); });
上面的代碼表示,當鼠標單擊 "p" 元素時,隱藏該元素。
我們還可以使用 on() 函數來為多個事件類型綁定同一個事件處理函數,例如:
$(document).ready(function(){ $("p").on("mouseenter mouseleave", function(){ $(this).toggleClass("highlight"); }); });
上面的代碼表示,當鼠標移入或移出 "p" 元素時,切換該元素的 CSS 類。
總之,在 jQuery 中,使用 on() 函數來為 DOM 元素綁定事件是非常方便和靈活的。