jQuery中的delegate()函數(shù)可以綁定事件,不僅可以綁定在某個元素上,還可以綁定在其父元素上,并加上一個篩選器,這樣就實現(xiàn)了事件冒泡的功能。在狀態(tài)改變或操作改變時,通過捕獲事件的冒泡結(jié)果來處理事件。
delegate()函數(shù)的語法格式如下:
$(selector).delegate(childSelector,event,data,function)
其中,selector表示父元素,childSelector表示子元素,event表示觸發(fā)事件,data表示傳遞的數(shù)據(jù),function表示執(zhí)行的方法。
冒泡是指,當事件發(fā)生在一個元素上時,它會向父元素一層層傳遞,直到document對象為止。如果父元素上面綁定了同樣類型的事件,那么這個事件也會被觸發(fā),這就叫做事件冒泡。
使用delegate()函數(shù)來實現(xiàn)冒泡,可以達到節(jié)約代碼和提高性能的作用。在父元素上綁定一個事件,可以自動觸發(fā)所有在子元素上綁定該事件的代理函數(shù),從而節(jié)省綁定事件的代碼量,減輕瀏覽器的負擔。
下面是一個例子,演示如何使用delegate()函數(shù)實現(xiàn)事件冒泡:
$('body').delegate('.parent','click',function(){ alert('父元素被點擊'); }); $('.child').delegate('click',function(){ alert('子元素被點擊'); });
當子元素被點擊時,父元素的代理事件也會被觸發(fā)。這樣就可以實現(xiàn)在父元素上只綁定一次事件,卻能夠代理處理多個子元素的事件。