javascript事件

原文連接:http://www.w3.org/TR/2000/REC-DOM-Level-2-Events-20001113/events.html#Events-overviewhtml

DOM2事件模型概覽

DOM2事件模型旨在兩個方面的設計。瀏覽器

  • 第一,設計可加入事件處理的原始事件系統,經過樹結構來描述事件流,給每一個事件提供基本的上下文信息。另外,規範爲用戶交互控制和文檔變化通知提供標準事件模型,包含針對這些事件模型的已定義的上下文信息。
  • 第二,事件模型的另外一個目的是提供一部分已在DOM0級瀏覽器下使用的事件系統。這是爲了促進已存在的腳本和內容的交互能力。這可能並必定向後兼容,但規範要儘可能作到這一點。
    下面的事件模型規範定義了DOM事件模型的規範和一些用於模型中相應的時間模型。事件模型由兩種事件冒泡、事件監聽和事件交互組成。
    一個DOM應用會以Events和2.0爲參數使用DOMImplementation接口的hasFeature(feature,version)方法,來查看事件模型是否被該實現所支持。爲了徹底支持這個模型,實現者必須還要支持DOM2 Core規範的DOM Level 2 CoreCore功能。你還能夠參照DOM2 Core規範中的conformance來獲取更多信息。
    每一個事件模型在其事件模型列表中描述了他自身的功能。

    術語

  • UI事件(UI events)
    即用戶交互事件。這些事件經過用戶使用外部設備(鼠標,鍵盤等)觸發。
  • UI邏輯事件(UI Logical events)
    設備無關的用戶交互事件,如焦點改變消息或元素觸發通知。
  • 突變事件(Mutation events)
    任意改變文檔結構的行爲觸發的事件。
  • 捕獲(Capturing)
    一個事件在被事件目標處理以前,先被事件目標的某個祖先處理。
  • 冒泡(Bubbling)
    一個事件在被事件目標處理以後,再被事件目標的某個祖先處理。
  • 可取消(Cancelable)
    用來在處理事件時,用戶能夠選擇阻止DOM實現框架執行事件任何默認行爲。

事件流描述

事件流是一個過程,一個事件起源於DOM實現,經過它來傳遞到文檔對象模型。事件捕獲和事件冒泡方法,配合多種事件註冊技術,使得事件可經過各類方法處理。能夠在事件目標層面上處理,也能夠在文檔樹種的事件目標的上級處理。框架

基本事件流

每一個事件都有一個事件目標,DOM實現者經過該事件目標來控制該事件。這個事件目標被定義在事件的‘target’屬性上。當事件到達該目標,任何註冊在該事件目標上的監聽方法將被觸發。雖然該事件目標上的全部事件監聽必定會被這個事件目標接收的任何事件觸發,可是沒有哪一個規範指出它們相對事件目標上的其餘監聽者接收事件的順序。若是一個事件沒有使用事件捕獲或事件冒泡,那麼該事件流必定是最後一個被觸發。若是使用了事件冒泡或事件捕獲,那麼事件流將按以下描述進行。
任何事件監聽者內部拋出的異常都是阻止該事件繼續冒泡。其餘的事件監聽者則按描述的方式繼續進行。
事件監聽者的行爲可能引起其餘的事件。另外的事件應該以異步方法被處理,並且可能引發事件模型的重入。dom

事件捕獲

經過事件捕獲,在事件被事件目標接收到以前,一個註冊在事件目標祖先上的事件監聽會影響這個事件。從樹的頂端(一般是Document節點)的捕獲,形成對稱的反向冒泡。從文檔樹頂端到事件目標處的事件目標鏈在事件最初被綁定的時候已經決定了。若是在事件處理過程當中發生了改變,事件流將基於最初的樹狀態進行。
一個綁定在時間目標上的事件監聽能夠選擇經過將addEventListener方法的useCaptrue參數設置爲true來使用事件捕獲。所以,當一個給定類型的事件被綁定在該捕獲對象的後代元素上時,該事件將觸發文檔樹頂端到事件目標上全部的捕獲事件監聽。這個向下的冒泡將一直繼續,直到事件到達事件目標。一個基於某個事件目標註冊的捕獲事件監聽,不會被直接綁定在該事件目標上的事件所觸發。
若是一個捕獲事件監聽想要阻止後來的事件發生,那麼它須要調用事件接口的stopPropagation方法。它將阻止以後的時間調度,就算註冊在相同層級上的另外的事件監聽仍然會接收到該事件。一旦事件的stopPropagation方法被調用,以後對該方法的再次調用將不會有任何影響。若是不存在另外的捕獲且stopPropagation沒有被調用,那麼事件會觸發目標上的相應的監聽器。
雖然事件捕獲和事件委託相似,但仍是有兩點區別:異步

  • 第一,事件捕獲只容許來自捕獲事件目標的後代元素的影響。而不容許來自於捕獲者祖先、兄弟元素或兄弟元素的後代元素的事件的影響。
  • 第二,事件捕獲並非定義爲單一事件目標,它用於特定類型的事件。一旦指定,對於全部de捕獲者的後代元素,事件捕獲會影響特定類型的全部事件。

事件冒泡

定義爲冒泡的事件會循環處理一個相同的事件流,就像該事件流是非冒泡的同樣。事件被綁定在它的事件目標上,且這裏的全部事件監聽被觸發。冒泡事件會接着觸發事件緊跟在目標父元素上方的鏈上另外的事件,檢測其餘註冊在事件目標上的事件監聽。這個向上的冒泡會一直持續到文檔樹的Document節點(包含Document節點)。捕獲類的註冊事件在該階段不會被觸發。從事件目標到文檔樹頂端的事件目標鏈在事件綁定初始化時已經被肯定了。若是在事件處理過程當中發生了任何改變,事件流將基於最初的樹狀態進行。函數

事件取消

一些事件被設計成是可取消的。對於這些事件,DOM實現着一般有默認行爲。例如瀏覽器對於超連接。若是用戶點擊了連接,默認一般會激活這個連接。在處理這些事件以前,實現者會檢測註冊的事件監聽來接收該事件並將事件傳遞給這些監聽者。這些監聽者以後會選擇取消實現者的默認星外或容許這個默認行爲。可是取消瀏覽器中的超連接的默認行爲將不會激活該超連接。
經過事件的preventDefault方法來進行默認行爲取消。當一個或多個事件監聽在事件流執行過程當中調用了preventDefault方法,那麼默認行爲將會被取消。
不一樣的實現者會定義本身的默認行爲。DOM不會嘗試定義這些行爲。spa

事件監聽註冊

事件註冊接口

事件目標接口(定義在DOM2中)
EventTarget接口由實現者中支持DOM事件模型的Nodes來實現。所以,該接口經過在Node接口實例上使用特定綁定的方法來實現。該接口容許事件目標上的事件監聽的註冊和刪除以及事件目標上的事件調度。設計

接口定義
 
 
 
 
 
// Introduced in DOM Level 2:interface EventTarget {void addEventListener(in DOMString type,in EventListener listener,in boolean useCapture);void removeEventListener(in DOMString type,in EventListener listener,in boolean useCapture);boolean dispatchEvent(in Event evt)raises(EventException);};
方法
  • addEventListener
    這個方法用來在事件目標上註冊事件監聽函數。當一個事件監聽在處理事件時被添加到事件目標上,那麼他將不會被當前行爲觸發,而可能會在接下來的事件流步驟中被觸發,好比冒泡過程。若是多個相同的事件監聽器被註冊在一樣一個事件目標上,並使用相同的參數,那麼會丟棄重複的監聽器。它們不會使事件監聽被調用屢次,由於它們是被丟棄掉的,而不須要使用removeEventListener方法刪除。
    參數
    • type(字符串類型)
      用戶註冊的事件類型
    • listener (事件監聽器類型)
      該事件監聽器承載了一個用戶實現的接口,它包含了事件發生時要調用的方法。
    • useCapture(布爾類型)
      若是爲true,那麼代表用戶但願建立捕獲。一旦建立了捕獲,特定類型的事件將在被指派給樹結構下方的全部事件目標以前被指派給註冊的事件監聽器。經過樹向上冒泡的事件將不會觸發一個指定使用捕獲的事件。
    • 無返回值
    • 不會拋出異常
  • dispatchEvent
    該方法用來將事件調度到實現者的事件模型中。以該方式調度的事件和實現者直接調度的事件有同樣的捕獲和冒泡。事件的目標就是dispatchEvent方法的做用的事件目標。
    參數
    • evt(事件類型)
      指定用於處理事件的事件類型、表現、上下文信息。
    • 返回值
      返回布爾類型的值,dispatchEvent的返回值用來表示處理事件的監聽函數是否調用了preventDefault。若是調用了preventDefault,那麼返回true,不然返回false。
    • 異常
      UNSPECIFIED_EVENT_TYPE_ERROR: 在調用dispatchEvent前,當事件的類型沒有在事件建立時被定義,會發生該異常。當指定事件類型爲null或空時也會產生該異常。
  • removeEventListener
    該方法用來從事件目標上移除事件監聽器。在事件目標處理事件時,若是時間監聽器從事件目標上移除,它將再也不被當前的行爲觸發。事件監聽器在被移除後將再也不被調用。
    參數
    • type (字符串類型)
      指定要移除的事件的類型
    • listener (事件監聽器類型)
      該參數指定了要移除的事件監聽器
    • useCapture (布爾值)
      指定要移除的事件監聽器是否被註冊爲一個捕獲監聽。若是監聽器被註冊了兩次,一次爲捕獲一次爲非捕獲,那麼這兩個將被分別移除。捕獲監聽器的移除並不會影響該監聽器的非捕獲版本,反之亦然。
    • 無返回值
    • 無拋出異常
  • 事件監聽接口(定義在DOM2)
    事件監聽接口是處理事件的基本方法。用戶實現事件監聽接口且在事件目標上使用AddEventListener註冊他們的事件監聽器。完成監聽後,用戶也能夠從事件目標上移除他們的事件監聽器。
    當使用cloneNode方法克隆一個節點時,原節點上的事件監聽器並不會被複制到節點副本上。若是用戶但願在克隆節點上使用這些監聽器,需手動添加。
    接口實現:
       
       
       
       
       
    // Introduced in DOM Level 2:interface EventListener {void handleEvent(in Event evt);};
    方法
  • handleEvent
    當一個事件目標接口註冊的類型事件發生時,調用該方法。
    參數
    • evt (事件類型)
      該事件對象包含了事件的上下文信息。它也包含了stopPropagation方法和preventDefault方法,這兩個方法用來肯定事件流和默認行爲。
    • 無返回值
    • 無拋出異常

      HTML4.0中的事件監聽接口

      在HTML4.0中,事件監聽被描述爲元素的屬性。一樣類型的事件綁定,後一個將會覆蓋前一個。DOM事件模型容許在一個事件目標上註冊多個監聽器。爲了達到這個目的,事件監聽器將再也不做爲屬性存在。
      爲了和HTML4.0兼容,實現者要考慮這個表示事件處理的屬性。useCapture參數默認爲false。該事件監聽器和其餘註冊在事件目標上的事件監聽器同樣。若是表示事件監聽器的屬性改變,這回被看成是對原先註冊的監聽器的移除後又從新建立的一個新的監聽器。沒有任何技術支持來容許HTML4.0的事件監聽器來獲取爲每一個事件定義的上下文信息。

      事件接口

      接口事件(定義在DOM2中)
      Event接口用來在處理事件時提供事件的上下文信息。一個實現了Event接口的對象一般做爲事件處理函數的第一個參數傳入。還有更多的特定上下文信息經過從Event對象派生額外接口得到,包含和該類型事件直接相關的一些信息。這些信息均可以被處理函數獲取。這些派生信息也能夠用來實現一個傳入到事件處理器中的對象。
      接口定義:
            
            
            
            
            
      // Introduced in DOM Level 2:interface Event {// PhaseTypeconst unsigned short CAPTURING_PHASE = 1;const unsigned short AT_TARGET = 2;const unsigned short BUBBLING_PHASE = 3;readonly attribute DOMString type;readonly attribute EventTarget target;readonly attribute EventTarget currentTarget;readonly attribute unsigned short eventPhase;readonly attribute boolean bubbles;readonly attribute boolean cancelable;readonly attribute DOMTimeStamp timeStamp;void stopPropagation();void preventDefault();void initEvent(in DOMString eventTypeArg,in boolean canBubbleArg,in boolean cancelableArg);};
  • 短語組:
    一個用來代表事件流被處理到哪一個階段的整型。
  • 常量:
    • AT_TARGET
      處於事件評估階段
    • BUBBLING_PHASE
      處於事件冒泡階段
    • CAPTURING_PHASE
      處於事件捕獲階段
  • 屬性
    • bubbles (布爾值),只讀
      用來表示事件是否爲冒泡事件。若是是冒泡事件則爲true,不然爲false。
    • cancelable(布爾值),只讀
      用來表示事件是否可取消其默認事件。若是默認行爲能夠被取消,則爲true,不然爲false。
    • currentTarget(事件目標類型),只讀
      用來表示正在處理事件監聽的事件的事件目標。在捕獲和冒泡階段該值是頗有用的。
    • eventPhase(無符號短整型),只讀
      用來表示事件流的當前階段
    • target(事件目標類型),只讀
      用來表示事件起始於哪一個事件目標
    • timeStamp(時間戳),只讀
      用來表示事件建立時間。一些系統實際上可能不會提供這個信息,並非全部的事件都有timeStamp值。若是該值不存在,那麼對它的調用將返回0。該時間爲UTC時間1970年1月1號 0:0:0到當前的毫秒數。
    • type(字符串類型),只讀
      事件的名稱(大小寫敏感)。名字必須爲一個XML name
  • 方法
    • initEvent
      該方法用來初始化一個經過DocumentEvent接口建立的事件。這個方法只能在事件經過dispatchEvent方法被調度以前使用,雖然它能夠在這個階段被調用屢次。被屢次調用時,以最後一次調用爲主。若是從Event接口的子類中被調用,那麼只有initEvent方法中定義的值會被改變,其餘的屬性不會被改變。
      該方法的參數:
      eventTypeArg(字符串)
      指定事件類型。這個事件能夠是本規範中定義的某個事件或是一個新的事件類型。該字符串必須是一個XML name。新的事件類型不能以字符串‘DOM’開頭(包含任意大寫,小寫或大小寫混合)。由於這個是之後DOM事件的保留字。強烈建議若是第三方要實現本身的額外方法,須要加上他們本身的前綴來避免混亂或和其餘新事件衝突。
      canBubbleArg(布爾值)
      表示事件是否能夠冒泡
      cancelableArg(布爾值)
      表示事件的默認事件是否能被取消
      無返回值
      無拋出異常
    • preventDefault
      若是一個事件是能夠被取消的,那麼preventDefault方法用來指定該事件要被取消,也就是說實現者對其的默認行爲不會發生。若是在事件流的任意階段,調用preventDefault方法都使得事件被取消。事件上的任意默認行爲都不會發生。對於不可取消默認行爲的事件,該方法不起做用。一旦調用preventDefault方法,它將影響事件冒泡的剩餘階段。該方法可用在事件流的任一階段。
      無參數
      無返回值
      無拋出異常
    • stopPropagation
      該方法用來在事件流中阻止以後的事件冒泡。若是事件監聽器使用了該方法,那麼事件將中止其在文檔樹上的冒泡。該事件將在事件流中止前調用當前事件目標上的全部監聽器。該方法可用在事件流的任一階段。
      無參數
      無返回值
      無拋出異常
      異常(定義在DOM2中的事件異常)
      事件操做可能會拋出如定義在方法描述中的異常
      接口定義
            
            
            
            
            
      // Introduced in DOM Level 2:exception EventException {unsigned short code;};// EventExceptionCodeconst unsigned short UNSPECIFIED_EVENT_TYPE_ERR = 0;
      事件異常碼
      一個用來表示錯誤產生類型的整型
      恆量
      UNSPECIFIED_EVENT_TYPE_ERR
      在調用方法前,若是事件類型並未經過事件初始化定義 ,或事件類型爲null或空時,都會拋出該異常。

      文檔事件接口

      文檔事件接口(定義在DOM2)
      文檔事件接口提供一種機制,經過該機制,用戶能夠建立一個實現者支持的事件。這意味着文檔事件接口能夠在同一個對象上實現,該對象在一個支持事件模型的實現中實現了Document接口。
      接口定義:
            
            
            
            
            
      // Introduced in DOM Level 2:interface DocumentEvent {Event createEvent(in DOMString eventType)raises(DOMException);};
  • 方法
    • createEvent
      參數
      eventType(字符串類型)
      該參數指定了要建立的事件接口的類型。若是指定的事件接口是被實現者支持的,那麼該方法返回一個指定接口類型的事件。若是事件是經過dispatchEvent方法調用的,那麼相應的事件初始化方法須要在建立後調用,以便初始化該事件的一些值。例如,用戶想同步一種UIEvent就要調用以UIEvent爲參數調用createEvent。而後在新的UIEvent上調用initUIEvent方法來設置UIEvent的會被調用的特性類型和一些上下文信息。
      在用戶不方便或沒必要要親自建立一個事件時,使用createEvent方法建立一個事件。當實現者對事件的支持不足時,用戶使用dispatchEvent方法來支持他們本身的事件實現。
      返回值
      新建立的事件
      異常
      NOT_SUPPORTED_ERR:當實現者不支持要求的事件接口類型時。

      事件模型定義

      DOM2事件模型容許一個DOM實現者支持多種事件模型。模型被定義爲容許額外的新事件模型。DOM不會嘗試定義全部的可能事件。爲了達到交互目的,DOM會定義一個與設備弱相關的用戶交互的模型,一個UI邏輯事件模型,或一個文檔變化事件模型。第三方定義的任一新的事件類型都不能以'DOM'開頭(無論任意大小寫組合)。這個前綴是做爲之後的DOM事件模型的保留字。強烈建議若是第三方要實現本身的額外方法,須要加上他們本身的前綴來避免混亂或和其餘新事件衝突。

      用戶交互事件模型

      用戶交互事件模型由列在HTML4.0中的事件和另外在DOM0級瀏覽器中支持的事件組成。
      一個DOM應用以UIEvent和2.0爲參調用DOMImplementation的hasFeature(feature,version)方法來檢測一個用戶交互事件是否被實現者支持。爲了全面支持這個模型,一個實現者必須同時支持本規範中定義的Events功能和在DOM2中定義的Views功能。你還能夠參照DOM2 Core規範中的conformance來獲取更多信息。
      注:使用UIEvents爲輸入參數調用DocumentEvent接口的createEvent方法來建立一個UIEvent實例。
      UIEvent接口(定義在DOM2中)
      UIEvent接口爲響應的用戶交互事件提供了特定的上下文信息。
      接口定義:
            
            
            
            
            
      // Introduced in DOM Level 2:interface UIEvent : Event {readonly attribute views::AbstractView view;readonly attribute long detail;void initUIEvent(in DOMString typeArg,in boolean canBubbleArg,in boolean cancelableArg,in views::AbstractView viewArg,in long detailArg);};
  • 屬性:
    • detail (長整型),只讀
      指定事件的一些細節信息。依賴於事件類型。
    • view(views::AbstractView類型),只讀
      view屬性標識事件從哪一個AbstractView產生。
  • 方法:
    • initUIEvent
      該方法用來初始化一個經過DocumentEvent接口建立的UIEvent的值。這個方法只能用來在UIEvent經過dispatchEvent方法調用前使用,雖然在這個階段它可能會被調用屢次。當屢次被調用時,以最後一次調用爲準。
      參數:
      typeArg(字符串類型)
      指定事件類型
      canBubbleArg(布爾類型)
      指定事件是否能冒泡
      cancelableArg(布爾類型)
      指定是否能夠阻止事件的默認行爲
      viewArg(views::AbstractView類型)
      指定事件的抽象視圖
      detailArg(長整型)
      指定事件的細節信息
      無返回值
      無拋出異常
      這些不一樣事件的發生場景:
      DOMFocusIn
      當一個事件目標得到焦點時,發生DOMFocusIn事件,例如,經過定位設備的tab鍵切換到一個元素上。它不一樣於HTML的focus事件,DOMFocusIn可被任何可得到焦點的事件目標使用,並不僅僅是表單控制。
    • 是否冒泡:是
    • 是否可取消: 否
    • 上下文信息:無
      DOMFocusOut
      當一個事件目標失去焦點時,發生DOMFocusOut事件。例如經過一個定位設備的tab鍵將焦點移出一個元素。它不一樣於HTML的blur事件,DOMFocusOut事件可應用於任何可得到焦點的事件目標,並不僅僅是表單控制。
    • 是否冒泡:是
    • 是否可取消: 否
    • 上下文信息:無
      DOMActivate
      當一個元素被激活時,發生該事件。例如,經過鼠標點擊或按下鍵盤。一個數字類型的參數將被傳入以說明發生了什麼:1表示普通的激活(如普通點擊或回車),2表示極度活躍(例如雙擊或shift+Enter)
    • 是否冒泡:是
    • 是否可取消: 是
    • 上下文信息:細節信息(數字類型的值)

      鼠標事件類型

      鼠標事件類型用HTML4.0中列出的事件和DOM0中定義的另外的事件組成。這類事件模型用於鼠標輸入設備的使用。
      一個DOM應用可使用MouseEvents, 2.0爲參數調用DOMImplementation接口的hasFeaturee(feature,version)方法來檢測實現者是否支持鼠標事件模型。爲了全面支持這個模型,一個實現者必須同時支持本規範中定義的Events功能和在DOM2中定義的Views功能。你還能夠參照DOM2 Core規範中的conformance來獲取更多信息。
      注:以功能字符串MouseEvents爲輸入參數調用DocumentEvent接口的createEvent方法來建立一個MouseEvent接口的實例。
      MouseEvent接口(DOM2中介紹)
      MouseEvent接口提供相應鼠標事件的上下文信息。
      detail屬性繼承至UIEvent,指定在用戶活動中同一屏幕下鼠標按下和鬆開的次數。用戶開始活動時,值記爲1,以後每次連續的單擊和鬆開增1。若是用戶在鼠標按下和彈起的過程當中移動了鼠標,那麼該值會置爲0,代表當前無單擊事件發生。
      在內嵌元素的鼠標事件發生在更深層次的內嵌元素上時。目標元素的祖先元素會使用冒泡來獲取發生在它後代元素上的鼠標事件。
      接口定義:
            
            
            
            
            
      // Introduced in DOM Level 2:interface MouseEvent : UIEvent {readonly attribute long screenX;readonly attribute long screenY;readonly attribute long clientX;readonly attribute long clientY;readonly attribute boolean ctrlKey;readonly attribute boolean shiftKey;readonly attribute boolean altKey;readonly attribute boolean metaKey;readonly attribute unsigned short button;readonly attribute EventTarget relatedTarget;void initMouseEvent(in DOMString typeArg,in boolean canBubbleArg,in boolean cancelableArg,in views::AbstractView viewArg,in long detailArg,in long screenXArg,in long screenYArg,in long clientXArg,in long clientYArg,in boolean ctrlKeyArg,in boolean altKeyArg,in boolean shiftKeyArg,in boolean metaKeyArg,in unsigned short buttonArg,in EventTarget relatedTargetArg);};
  • 屬性:
    • altKey(布爾值類型),只讀
      用來指定在事件發生過程當中alt鍵是否被按下,在一些系統中這個鍵可能被映射爲另外的名字。
    • button(無符號短整型),只讀
      在鼠標事件發生時,button用來表示哪一個鼠標鍵改變了狀態。button的值爲0時表示左鍵,爲1時表示中鍵(若是存在的話),爲2時表示右鍵。對於左手使用鼠標者來講,這些值按從右往左的順序。
    • clientX(長整型),只讀
      事件發生時,相對DOM實現者的用戶區域的水平座標
    • clientY(長整型),只讀
      事件發生時,相對DOM實現者的用戶區域的垂直座標
    • ctrlKey(布爾類型),只讀
      用來表示當事件發生時,ctrl鍵是否被按下
    • metaKey(布爾類型),只讀
      用來表示當事件發生時,meta鍵是否被按下。在一些系統中這個鍵可能被映射爲另外的名字。
    • relatedTarget(EventTarget類型),只讀
      用來表示UI事件的第二事件目標。當前這個屬性在mouseover事件中用來表示指針離開的事件目標,而在mouseout事件中表示指針進入的事件目標。
    • screenX(長整型),只讀
      用來表示事件發生時,相對於屏幕座標系統的水平座標
    • screenY(長整型),只讀
      用來表示事件發生時,相對於屏幕座標系統的垂直座標
    • shiftKey(布爾類型),只讀
      用來表示當事件發生時,shift鍵是否被按下
  • 方法
    • initMouseEvent
      該方法用來初始化一個經過DocumentEvent接口建立的鼠標事件。該方法只能在鼠標事件經過dispatchEvent方法調用前使用,雖然它可能會被調用屢次。若是被屢次調用,則以最後一次調用爲準。
      typeArg(字符串類型)
      指定事件的類型
      canBubbleArg(布爾類型)
      指定事件是否能夠冒泡
      cancelableArg(布爾類型)
      指定事件是否能夠取消其默認事件
      viewArg(views::AbstractView類型)
      指定事件的抽象視圖
      detailArg(長整型)
      指定事件的鼠標點擊次數
      screenXArg(長整型)
      指定事件在屏幕上的X座標
      screenYArg(長整型)
      指定事件在屏幕上的Y座標
      clientXArg(長整型)
      指定事件在用戶區域上的X座標
      clientYArg(長整型)
      指定事件在用戶區域上的Y座標
      ctrlKeyArg(布爾類型)
      指定事件發生時ctrl鍵是否被按下
      altKeyArg(布爾類型)
      指定事件發生時alt鍵是否被按下
      shiftKeyArg (布爾類型)
      指定事件發生時shift鍵是否被按下
      metaKeyArg(布爾類型)
      指定事件發生時meta鍵是否被按下
      buttonArg(無符號短整型)
      指定事件的鼠標鍵
      relatedTarget(EventTarget類型)
      指定事件的相關事件目標
      沒有返回值
      沒有拋出異常
      不一樣的鼠標事件:
  • click
    當定位設備在一個元素上單擊時,發生click事件。一次針對相同屏幕位置的鼠標按下和鬆開定義爲一次單擊。事件的發生前後順序爲:mousedown mouseup click
    若是在同一屏幕位置發生了屢次點擊,那麼該序列也隨着每次重複屢次。該事件對大多數的元素都是可用的。
    • 是否冒泡:是
    • 是否可取消:是
    • 上下文信息:screenX, screenY, clientX, clientY, altKey, ctrlKey, shiftKey, metaKey, button, detail
  • mousedown
    當定位設備的鍵在一個元素上被按下後,發生mousedown事件,該事件對大多數元素可用。
    • 是否冒泡:是
    • 是否可取消:是
    • 上下文信息:screenX, screenY, clientX, clientY, altKey, ctrlKey, shiftKey, metaKey, button, detail
  • mouseup
    當定位設備的鍵在一個元素上被鬆開時,發生mouseup事件,該事件對大多數元素可用。
    • 是否冒泡:是
    • 是否可取消:是
    • 上下文信息:screenX, screenY, clientX, clientY, altKey, ctrlKey, shiftKey, metaKey, button, detail
  • mouseover
    當定位設備移動到一個元素上時,發生mousemove事件,該事件對大多數元素可用
    • 是否冒泡:是
    • 是否可取消:是
    • 上下文信息:screenX, screenY, clientX, clientY, altKey, ctrlKey, shiftKey, metaKey, relatedTarget指定了定位設備從哪一個事件目標離開
  • mousemove
    當定位設備在一個元素上移動時,發生mousemove事件。該事件對大多數元素可用。
    • 是否冒泡:是
    • 是否可取消:否
    • 上下文信息:screenX, screenY, clientX, clientY, altKey, ctrlKey, shiftKey, metaKey
  • mouseout
    當定位設備從一個元素上移開時,發生mouseout事件。該事件對大多數元素可用
    • 是否冒泡:是
    • 是否可取消:是
    • 上下文信息:screenX, screenY, clientX, clientY, altKey, ctrlKey, shiftKey, metaKey, relatedTarget指定了定位設備從哪一個事件目標進入

      鍵盤事件

      DOM2事件規範沒有支持鍵盤事件模型。針對鍵盤輸入設備的事件模型定義在以後的DOM規範中。

      突變事件類型

      該事件類型用來對文檔樹的改變作出通知,包含對屬性或文字的改變。突變事件都是不可冒泡的。由於根據相關事件的取消,若是文檔樹發生了改變,對於改變文檔樹的目前DOM接口使用很是難。
      文檔樹的不少單一改變都會引發多種突變事件被觸發。這些事件會被留給實現者,而不是根據文檔樹的沒有可能的改變去定義這些事件。
      一個DOM應用以MutationEvents和2.0爲參數使用DOMImplementation接口的hasFeature(feature,version)方法來檢測實現者支持了突變事件。爲了全面支持這個模型,一個實現者必須同時支持本規範中定義的Events功能。你還能夠參照DOM2 Core規範中的conformance來獲取更多信息。
      注:使用字符串'MutationEvents'爲輸入參數調用DocumentEvent接口的createEvent方法來建立一個MutationEvent接口。
      突變事件接口(定義在DOM2中)
      MutationEvent接口提供相應的突變事件的上下文信息。
      接口定義:
            
            
            
            
            
      // Introduced in DOM Level 2:interface MutationEvent : Event {// attrChangeTypeconst unsigned short MODIFICATION = 1;const unsigned short ADDITION = 2;const unsigned short REMOVAL = 3;readonly attribute Node relatedNode;readonly attribute DOMString prevValue;readonly attribute DOMString newValue;readonly attribute DOMString attrName;readonly attribute unsigned short attrChange;void initMutationEvent(in DOMString typeArg,in boolean canBubbleArg,in boolean cancelableArg,in Node relatedNodeArg,in DOMString prevValueArg,in DOMString newValueArg,in DOMString attrNameArg,in unsigned short attrChangeArg);};
      attrChangeType:
      一個用來指定屬性是經過何種方式改變的整型。
  • 恆量:
    ADDITION
    僅僅是添加屬性
    MODIFICATION
    屬性被改變
    REMOVEL
    屬性被刪除
  • 屬性:
    attrChange(無符號短整型),只讀
    該屬性說明了是那種類型的改變觸發了DOMAttrModified事件。該屬性值可能爲MODIFICATION,ADDITION,REMOVAL
    attrName(字符串類型),只讀
    該屬性說明了在DOMAttrModified事件中發生改變的屬性節點。
    newValue(字符串類型),只讀
    該屬性說明了DOMAttrModified事件中屬性節點的新值,或DOMCharDataModified事件中CharacterData節點的新值。
    prevValue(字符串類型),只讀
    該屬性說明了DOMAttrModified事件中屬性節點的原值,或DOMCharDataModified事件中CharacterData節點的原值。
    relatedNode(節點類型),只讀
    該屬性用來表示和突變事件相關的節點。例如一個節點上的突變事件代表了它的父元素髮生了改變,那麼這個relatedNode就是發生改變的父元素。在子結構上發生的時間代表一個節點內部發生了改變,那麼relatedNode就是這個發生改變的節點。在DOMAttrModified事件中,relatedNode屬性表示發生了改變,添加或刪除的節點。
  • 方法:
    initMutationEvent
    該方法用來初始化一個經過DocumentEvent接口建立的MutationEvent。該方法只能在MutationEvent被經過dipatchEvent方法調用前調用,雖然必要時在這個階段它可能被調用屢次。若是被調用屢次,則按最後一個調用爲準。
    參數:
    typeArg(字符串類型)
    指定事件類型
    canBubbleArg(布爾類型)
    指定事件是否能夠冒泡
    cancelableArg(布爾類型)
    指定事件是否能夠取消其默認行爲
    relatedNodeArg(節點類型)
    指定事件的相關目標
    prevValueArg(字符串類型)
    指定事件的prevValue屬性。該值可能爲null。
    newValueArg(字符串類型)
    指定事件的newValue屬性。該值可能爲null。
    attrNameArg(字符串類型)
    指定事件的attrName屬性。該值可能爲null。
    attrChangeArg(無符號短整型)
    指定事件的attrChange屬性。
    無返回值
    無拋出異常
    不一樣形式的突變事件:
  • DOMSubtreeModified
    這是針對全部文檔改變的經常使用事件。它能夠替換如下列出的更多特定事件。可能會在文檔發生某個改變後被觸發,或者根據實現者的實現,在多種改變發生後被觸發。後一種使用方式一般用來適應同時發生的或忽然發生的多種改變。該事件的目標爲已經發生的最基本改變。在突變事件被觸發引發的事件後會觸發該事件。
    • 是否冒泡:是
    • 是否可取消默認事件:否
    • 上下文信息:無
  • DOMNodeInserted
    當一個節點被添加爲另外一個節點的子元素時觸發該事件。當節點插入後該事件被觸發。該事件的目標爲被插入的節點。
    • 是否冒泡:是
    • 是否可取消默認事件:否
    • 上下文信息:relatedNode處理父節點
  • DOMNodeRemoved
    當一個節點從它的父元素中刪除時發生該事件。在節點被從樹中移除前觸發該事件。該事件的目標爲被移除的節點。
    • 是否冒泡:是
    • 是否可取消默認事件:否
    • 上下文信息:relatedNode處理父節點
  • DOMNodeRemovedFromDocument
    當一個節點從樹中被刪除時發生該事件,不論是直接刪除仍是它包含的子樹被刪除。在刪除發生前觸發該事件。該事件的目標爲被移除的節點。若是節點是被直接刪除的,DOMNodeRemoved事件將會在DOMNodeRemovedFromDocument事件前發生。
  • DOMNodeInsertedIntoDocument
    當一個節點被插入到文檔中時發生該事件,不論是直接插入仍是內部子數的插入。在插入前觸發該事件。該事件的目標爲被插入的節點。若是節點是被直接插入的,DOMNodeInserted事件會在DOMNodeInsertedIntoDocument事件前發生。
    • 是否冒泡:否
    • 是否可取消默認事件:否
    • 上下文信息:無
  • DOMAttrModified
    當一個節點上的一個屬性被改變時發生該事件。該事件的目標爲發生屬性改變的節點。attrChange的值代表了屬性是被改變、添加仍是刪除。relatedNode的值表示被影響到屬性節點的節點。基於屬性值改變的字符串有望被映射爲屬性的改變。屬性節點隨後的改變會被映射爲上一個屬性的刪除和第二個屬性的添加。
    • 是否冒泡:否
    • 是否可取消默認事件:否
    • 上下文信息:attrName, attrChange, prevValue, newValue, relatedNode
  • DOMCharacterDataModified
    當節點的CharacterData被改變但節點自己沒有被插入或刪除時發生該事件。PI元素的改變也會觸發該事件。該事件的目標爲Character節點。
    • 是否冒泡:否
    • 是否可取消默認事件:否
    • 上下文信息:prevValue, newValue

HTML事件類型

HTML事件由HTML4.0中的事件和定義在DOM0中的另外的事件組成。
一個DOM應用使用'HTMLEvents'和'2.0'爲參數使用DOMImplementation接口的hasFeature(feature,version)方法來檢測實現者是否支持HTML事件模型。爲了全面支持這個模型,一個實現者必須同時支持本規範中定義的Events功能。你還能夠參照DOM2 Core規範中的conformance來獲取更多信息。
注:使用'HTMLEvents'爲輸入參數使用DocumentType接口的createEvent方法來爲HTML事件模型建立一個Event實例。
HTML事件使用基本DOM事件接口來傳遞上下文信息。
各類HTML事件:指針

  • load
    當DOM實現者完成了文檔中的全部內容、FRAMESET中的全部框架或一個OBJECT元素的加載時發生該事件。
    • 是否冒泡:否
    • 是否可取消默認事件:否
    • 上下文信息:無
  • unload
    當DOM實現者將一個文檔從窗口或框架中刪除時發生該事件。該事件對BODY和FRAMESET元素可用。
    • 是否冒泡:否
    • 是否可取消默認事件:否
    • 上下文信息:無
  • abort
    當一個圖片被徹底加載前頁面加載被中止時,發生該事件。該事件應用於OBJECT元素。
    • 是否冒泡:是
    • 是否可取消默認事件:否
    • 上下文信息:無
  • error
    當一個圖片沒被正確加載或在腳本執行時發生錯誤時發生該事件。該事件對OBJECT元素可用。
    • 是否冒泡:是
    • 是否可取消默認事件:否
    • 上下文信息:無
  • select
    當用戶在文本區域選中了一些文字時發生該事件。該事件對INPUT元素和TEXTAREA元素可用。
    • 是否冒泡:是
    • 是否可取消默認事件:否
    • 上下文信息:無
  • change
    在一個輸入框獲取焦點後其值發生了改變,發生該事件。該事件對於INPUT,SELECT,TEXTAREA元素可用。
    • 是否冒泡:是
    • 是否可取消默認事件:否
    • 上下文信息:無
  • submit
    當提交表單時發生該事件。該事件只對FORM元素可用
    • 是否冒泡:是
    • 是否可取消默認事件:是
    • 上下文信息:無
  • reset
    當表單被重置時發生該事件。該事件只能應用於FORM元素
    • 是否冒泡:是
    • 是否可取消默認事件:否
    • 上下文信息:無
  • focus
    當一個元素得到焦點時發生該事件,不論是經過定位設備或是經過tab切換。該事件對如下元素可用:LABEL, INPUT, SELECT, TEXTAREA, and BUTTON
    • 是否冒泡:否
    • 是否可取消默認事件:否
    • 上下文信息:無
  • blur
    當一個元素失去焦點時發生該事件,不論是經過定位設備或是經過tab切換。該事件對如下元素可用:LABEL, INPUT, SELECT, TEXTAREA, and BUTTON.
    • 是否冒泡:否
    • 是否可取消默認事件:否
    • 上下文信息:無
  • resize
    當文檔視圖的尺寸被調整時發生該事件。
    • 是否冒泡:是
    • 是否可取消默認事件:否
    • 上下文信息:無
  • scroll
    當文檔視圖被滾動時發生該事件
    • 是否冒泡:是
    • 是否可取消默認事件:否
    • 上下文信息:無


相關文章
相關標籤/搜索