在前端開發中,經常需要對多個元素同時進行事件綁定,這個時候jquery的on方法就非常方便了。
$(document).on('click', '.class-selector', function() { // 執行代碼 });
上面的代碼會在整個document上監聽click事件,當事件源是class為class-selector的元素時,就會執行綁定的函數。
需要注意的是,使用on方法綁定事件時,可以直接傳遞函數作為第二個參數,也可以傳遞一個字符串選擇器加函數作為參數,如下所示:
$('.class-selector').on('click', function() { // 執行代碼 });
上面的代碼就是用class為class-selector的元素來監聽click事件,并執行綁定的函數。
如果想要同時監聽多個事件類型,可以通過空格分割事件類型來實現:
$('.class-selector').on('click touchstart', function() { // 執行代碼 });
上面的代碼就會在class為class-selector的元素上,同時監聽click和touchstart事件,并執行綁定的函數。
總之,使用jquery的on方法來對多個元素進行事件綁定,可以大大提高代碼的可閱讀性和可維護性,是一個非常好用的工具。