jquery中事件

1、加載DOM元素

傳統的window.onload();網頁中的所有元素(包括元素的所有關聯文件)完成加載到瀏覽器後,纔可執行(js此時可訪問網頁中的任何元素);只能保存對一個函數的調用,會自動用後面的函數覆蓋前面的函數;

jquery中的$(document).ready(function(){});在dom完全就緒時就可以被調用,無需等到元素關鍵的文件全部下載完畢;可多次調用;

2、事件綁定

bind(type[,data],fn):type指事件類型;data指傳遞的參數;fn指回調函數

3、合成事件

hover(enter,leave):模擬光標懸停事件,當光標移動到元素上時,觸發第一個函數;當光標移出這函數時,會觸發第二個函數。

toggle(fn1,fn2,...fnN):模擬鼠標連續單擊事件,每單擊一次,依次執行函數

4、冒泡

現象:頁面上可以有多個事件,也可以多個元素響應同一個事件。如在body、div和span都定義了單擊事件,當執行span上的單擊事件時,則會依次執行span、div和body上的單擊事件。

引發問題:如上述,只想執行span上的單擊事件,就會存在問題。

引發問題解決方案

事件對象:需爲函數增加一個參數,如$('element').bind('click',function(event){});其中,event爲事件對象。

停止事件冒泡:在span元素的單擊方法執行完畢後,調用stopPrepagation()方法來停止事件冒泡。

阻止默認行爲:調用event對象的preventDefault方法。

事件捕獲:和事件冒泡相反的過程,從最頂端往下開始觸發。上述例子,則是從body、div和span的順序,從最外層元素開始,然後再到最裏層元素。

4、事件對象的屬性

event.type()方法可以捕獲事件的類型
event.preventDefault()方法阻止默認的事件行爲
event.stopPropageation()方法阻止事件的冒泡
event.target()方法獲取到觸發事件的元素;
event.pageX()和pageY()方法獲取到光標相對於頁面的x座標和y座標,ie和火狐下有差別
event.which()方法在鼠標單擊事件中,獲取到鼠標的左、中、有鍵,1左、

5、移出事件,調用unbind方法,支持移除所有方法及指定的方法;可以調用one方法定義觸發一次就接觸綁定的方法

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章