jQuery事件中on實現繫結多個事件

2021-09-08 21:59:09 字數 1381 閱讀 4358

相信大家都知道在jquery1.9版本中,已經去掉了livedelegate方法,從而將on方法的地位進一步提公升。

jquery如此推崇on方法,必有其獨到的地方。所以我們就有必要了解這個on,並在**中利用它,從而優化**和提高效能。那麼接下來我們就來看看on的使用方法

語法結構: jq物件.on(「事件型別」,」事件處理函式」)

函式語法結構:jq物件.on(「事件型別1 事件型別2」,」事件處理函式」)

語法結構:

jq物件.on(

注意: 使用jqueryon進行普通繫結事件的時候,會出現一些小小問題,就是不能給動態新增的元素繫結事件,

這時候就要用到on的事件委派(事件委託),接下來我們繼續看看on對於事件委託的處理

當目標元素被觸發時,先從它祖先元素一層一層將事件傳達給目標函式,如上圖中p的父元素div依次傳遞給target,此為事件捕獲;

–當目標函式被觸發後,又將事件一層一層傳遞到根節點,即老祖宗,此為事件冒泡。所有瀏覽器都有事件冒泡機制。所以,我們可以利用這一特性,優化**,減少事件繫結。

on方法也利用了這一特性。當『selector』被提供時,就是事件委託,事件觸發時,直接繫結在on方法上的元素是不會觸發該事件,而它指定的後代元素『selector』就會利用冒泡機制,到直接繫結在on方法上的元素,給予處理。

總結: 如果是普通繫結事件你就可以使用on的普通事件繫結,如果是對於動態新增的元素的事件繫結就使用on的事件委派。

JQuery中的事件繫結

事件冒泡 在乙個物件上觸發某類事件 比如單擊onclick事件 如果此物件定義了此事件的處理程式,那麼此事件就會呼叫這個處理程式,如果沒有定義此事件處理程式或者事件返回true,那麼這個事件會向這個物件的父級物件傳播,從裡到外,直至它被處理 父級物件所有同類事件都將被啟用 或者它到達了物件層次的最頂...

jQuery中的事件繫結

在頁面載入完畢時,程式可以通過為元素繫結事件完成相應的操作。在jquery中,事件繫結通常可以分為為元素繫結事件 移除繫結和繫結一次性事件處理3種情況,下面分別進行介紹。一 為元素繫結事件 在jquery中,為元素繫結事件可以使用bind 方法,該方法的語法結構如下 bind type,data f...

jQuery中的事件繫結

在頁面載入完畢時,程式可以通過為元素繫結事件完成相應的操作。在jquery中,事件繫結通常可以分為為元素繫結事件 移除繫結和繫結一次性事件處理3種情況,下面分別進行介紹。一 為元素繫結事件 在jquery中,為元素繫結事件可以使用bind 方法,該方法的語法結構如下 bind type,data f...