Jquery中有一個很常用的方法叫做on(),它可以為指定的事件添加一個或多個事件處理函數,并且可以輕松地動態地添加或刪除事件處理函數。
// 添加點擊事件處理函數 $("#btn").on("click", function(){ alert("按鈕被點擊了!"); }); // 動態添加事件處理函數 $("#box").on("click", "#child", function(){ alert("子元素被點擊了!"); }); // 刪除事件處理函數 var handler = function(){ alert("被刪除的事件處理函數"); }; $("#btn").on("click", handler); $("#btn").off("click", handler);
上述代碼中,第一個例子為按鈕添加了一個點擊事件處理函數,當按鈕被點擊時,彈出一個警告框。
第二個例子演示了如何通過on()方法動態地添加一個事件處理函數,為id為box的元素的子元素id為child的元素添加了一個點擊事件處理函數。這里注意到,因為該元素是動態生成的,所以無法在頁面加載時為其綁定事件,on()方法的事件委托機制可以在這種情況下起到很好的作用。
第三個例子展示了如何刪除在第一個例子中添加的事件處理函數。對于同一個元素上的多個事件處理函數,可以在off()方法中指定需要刪除的事件處理函數來刪除其中之一。