資源描述：
《Java程序員從笨鳥(niǎo)到菜鳥(niǎo)之九十跟我學(xué)jquery六jquery中事件詳解》由會(huì)員上傳分享，免費(fèi)在線(xiàn)閱讀，更多相關(guān)內(nèi)容在工程資料-天天文庫(kù)。
1、由于jquery本身就是web客戶(hù)端的有力幫手，所以事件對(duì)于它來(lái)說(shuō)就顯得尤為重要了，事件是腳本編程的靈魂.所以此內(nèi)容也是jQuery學(xué)習(xí)的重點(diǎn)。在傳統(tǒng)的javascript中，注冊(cè)一個(gè)事件也是非常簡(jiǎn)單的事情，下面我們具體看一下一個(gè)簡(jiǎn)單的示例：document.getElementById("testDiv2").onclick=showMsg;等效于:<divid="testDiv1"onclick="alert("!!!");">單擊
2、事件1</div>注意兩者的區(qū)別了嗎?我們常用的修改元素屬性添加事件的方式,實(shí)際上是建立了一個(gè)匿名函數(shù):document.getElementById("testDiv1").onclick=function(event){alert("!!!");};這個(gè)匿名函數(shù)的簽名和我們手寫(xiě)的showMsg簽名相同,所以可以把showMsg直接賦值給onclick.這種方式的弊端是:1.只能為一個(gè)事件綁定一個(gè)事件處理函數(shù).使用"="賦值會(huì)
3、把前面為此時(shí)間綁定的所有事件處理函數(shù)沖掉.2.在事件函數(shù)(無(wú)論是匿名函數(shù)還是綁定的函數(shù))中獲取事件對(duì)象的方式在不同瀏覽器中要特殊處理:3.添加多播委托的函數(shù)在不同瀏覽器中是不一樣的.所以我們首先應(yīng)該摒棄<divonclick="..."></div>這種通過(guò)修改元素屬性添加事件的方式.盡量使用添加多播事件委托的方式為一個(gè)事件綁定多個(gè)事件處理函數(shù),比如為document對(duì)象的單擊事件添加一個(gè)關(guān)閉彈出層的方法,使用多播就不會(huì)影響document對(duì)象原有的事件處理函數(shù).Jquery事件：從
4、上面我們看到了javascript中注冊(cè)事件的弊端了，這些弊端真正避免起來(lái)也挺麻煩的，所以jquery想到了這一點(diǎn)，他幾乎把javascript中的事件弊端解決到了極點(diǎn)，我們可以很簡(jiǎn)單的實(shí)現(xiàn)我們?cè)趈avascript中很麻煩才能實(shí)現(xiàn)的功能。正所謂有了jQuery,天天喝茶水.下面是在jQuery中最常使用的bind()方法舉例:$("#testDiv").bind("click",showMsg);我們?yōu)閕d是testDiv4的元素,添加列click事件的事件處理函數(shù)showMsg.使用
5、jQuery事件處理函數(shù)的好處:1.添加的是多播事件委托.也就是為click事件又添加了一個(gè)方法,不會(huì)覆蓋對(duì)象的click事件原有的事件處理函數(shù).$("#testDiv").bind("click",function(event){alert("one");});$("#testDiv").bind("click",function(event){alert("two");});單擊testDiv對(duì)象時(shí),依次
6、提示"one"和"two".2.統(tǒng)一了事件名稱(chēng).添加多播事件委托時(shí),ie中是事件名稱(chēng)前面有"on".但是使用bind()函數(shù)我們不用區(qū)分ie和dom,因?yàn)閮?nèi)部jQuery已經(jīng)幫我們統(tǒng)一了事件的名稱(chēng).3.可以將對(duì)象行為全部用腳本控制.讓HTML代碼部分只注意"顯示"邏輯.現(xiàn)在的趨勢(shì)是將HTML的行為,內(nèi)容與樣式切分干凈.其中用腳本控制元素行為,用HTML標(biāo)簽控制元素內(nèi)容,用CSS控制元素樣式.使用jQuery事件處理函數(shù)可以避免在HTML標(biāo)簽上直接添
7、加事件.Jquery常用事件函數(shù)：雖然我們可以使用事件處理函數(shù)完成對(duì)象事件的幾乎所有操作,但是jQuery提供了對(duì)常用事件的封裝.比如單擊事件對(duì)應(yīng)的兩個(gè)方法click()和click(fn)分別用來(lái)觸發(fā)單擊事件和設(shè)置單擊事件.設(shè)置單擊事件:$("#testDiv").click(function(event){alert("testdivclicked!");});等效于:$("#testDiv").bind("click",function(ev
8、ent){alert("testdivclicked!");});觸發(fā)單擊事件:$("#testDiv").click();等效于$("#testDiv").trigger("click");注意
