讀jQuery之十 事件模塊概述
雖然事件模塊代碼很難讀,但其提供的API接口還是很清晰的。如下

1 添加事件(bind/one/live/delegate/hover/toggle)
bind 基本的添加事件函數(shù)。
one 添加只執(zhí)行一次的事件函數(shù)。
live 事件代理(使用document代理)。
delegate 事件代理(使用指定元素代理)。
hover 模擬css的hover。
toggle 顯示/隱藏。
bind/one/live 都是使用內(nèi)部的jQuery.event.add 來完成事件添加。
delegate 內(nèi)部調(diào)用的是live。
hover 內(nèi)部使用mouseenter/mouseleave,而mouseenter/mouseleave又使用bind。
toggle 內(nèi)部使用click,而click內(nèi)部又調(diào)用的是bind。
實(shí)際上jQuery的一個(gè)each調(diào)用就給jQuery對(duì)象上增加了24個(gè)添加事件的快捷方法
如下圖
如下圖
記住,bind調(diào)用的是jQuery.event.add,因此 jQuery.event.add 才是整個(gè)jQuery添加事件模塊的核心。以上所有的方法都是在其之上構(gòu)建的上層應(yīng)用。如圖
2 刪除事件 (unbind/die/undelegate)
unbind 刪除事件基礎(chǔ)方法??梢詣h除一個(gè)指定handler,還可以刪除某類型事件的全部handler,甚至可以刪除掛在element上的全部事件。其內(nèi)部調(diào)用jQuery.event.remove。
die/undelegate 刪除事件代理。 內(nèi)部都使用unbind。
因此, jQuery.event.remove 才是整個(gè)jQuery刪除事件模塊的核心。unbind/die/undelegate都是在其之上構(gòu)建的上層應(yīng)用。如圖
3 觸發(fā)事件(trigger/triggerHandler)
trigger 觸發(fā)一個(gè)事件(會(huì)冒泡)
triggerHandler 觸發(fā)一個(gè)事件(不會(huì)冒泡)
trigger/triggerHandler 內(nèi)部調(diào)用的都是jQuery.event.trigger,因此jQuery.event.trigger 才是整個(gè)jQuery觸發(fā)事件模塊的核心。如圖
相關(guān)文章
jQuery實(shí)現(xiàn)的checkbox級(jí)聯(lián)選擇下拉菜單效果示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的checkbox級(jí)聯(lián)選擇下拉菜單效果,涉及jQuery鼠標(biāo)事件響應(yīng)及表格table動(dòng)態(tài)操作的相關(guān)技巧,需要的朋友可以參考下2016-12-12jQuery實(shí)現(xiàn)的右下角廣告窗體跟隨效果示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的右下角廣告窗體跟隨效果,涉及jQuery結(jié)合時(shí)間函數(shù)動(dòng)態(tài)操作頁(yè)面元素屬性的相關(guān)技巧,需要的朋友可以參考下2016-09-09jquery彈窗時(shí)禁止body滾動(dòng)條滾動(dòng)的例子
今天小編就為大家分享一篇jquery彈窗時(shí)禁止body滾動(dòng)條滾動(dòng)的例子,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-09-09jquery popupDialog 使用 加載jsp頁(yè)面的方法
下面小編就為大家?guī)硪黄猨query popupDialog 使用 加載jsp頁(yè)面的方法。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-10-10通過jquery實(shí)現(xiàn)tab標(biāo)簽瀏覽效果
這篇文章主要介紹了通過jquery實(shí)現(xiàn)tab標(biāo)簽瀏覽效果2007-02-02jQuery實(shí)現(xiàn)tab標(biāo)簽自動(dòng)切換的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)tab標(biāo)簽自動(dòng)切換的方法,實(shí)例分析了jQuery操作tab標(biāo)簽的技巧,涉及addClass、siblings及removeClass鏈?zhǔn)讲僮鞯募记?需要的朋友可以參考下2015-02-02jquery實(shí)現(xiàn)LED廣告牌旋轉(zhuǎn)系統(tǒng)圖片切換效果代碼分享
這篇文章主要介紹了jquery實(shí)現(xiàn)LED廣告牌旋轉(zhuǎn)系統(tǒng)圖片切換效果類似路邊場(chǎng)景,很實(shí)用的代碼,推薦給大家,有需要的小伙伴可以參考下。2015-08-08與jquery serializeArray()一起使用的函數(shù),主要來方便提交表單
與jquery serializeArray()一起使用的函數(shù),主要來方便提交表單,需要的朋友可以參考下。2011-01-01