Microsoft AJAX Library Cheat Sheet（4）：DomEvent類

本文為翻譯，英文原版的Cheat Sheet（PDF版本）在此下載：http://aspnetresources.com/downloads/ms_ajax_library_cheat_sheets1.zip

原作著作權聲明：

Copyright (c) 2004-2006, Milan Negovan http://www.AspNetResources.comAll rights reserved.Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:    * Redistributions of source code must retain the above copyright       notice, this list of conditions and the following disclaimer.          * Redistributions in binary form must reproduce the above copyright       notice, this list of conditions and the following disclaimer in       the documentation and/or other materials provided with the       distribution.          * The name of the author may not be used to endorse or promote products      derived from this software without specific prior written permission.THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

 

註：標註有[S]的為靜態方法，無須執行個體化對象即可使用。

 

[S] addHandler (element, eventName, handler)
[S] $addHandler (element, eventName, handler)

為DOM元素添加某一事件的處理函數，事件名稱應去掉“on”首碼。

注意：在事件處理函數中，this指向的是element，而不一定是發出該事件的元素。

Sys.UI.DomEvent.addHandler (element, "click", clickHandler);

// Same as $addHandler (element, "click", clickHandler);

function clickHandler (e) { … }

 

[S] addHandlers (element, events, handlerOwner)
[S] $addHandlers (element, events, handlerOwner)

為DOM元素添加多個事件處理函數，events是一個事件處理函數的字典。

注意：在事件處理函數中，若指定了handlerOwner，那麼this將指向該handlerOwner，否則將指向element。

$addHandlers ($get ("article"), {

    mouseover: onMouseOver,

    mouseout: onMouseOut

});

function onMouseOver (e) { this.style.backgroundColor = 'yellow'; }

function onMouseOut (e) { this.style.backgroundColor = 'white'; }

 

[S] clearHandlers (element)
[S] $clearHandlers (element)

移除指定DOM元素所有的事件處理函數。

Sys.UI.DomEvent.clearHandlers (element);

// Same as $ clearHandlers (element);

 

[S] removeHandler (element, eventName, handler)
[S] $removeHandler (element, eventName, handler)

為DOM元素移除指定的事件處理函數。

Sys.UI.DomEvent.removeHandler (element, "click", clickHandler);

// Same as $removeHandler (element, "click", clickHandler);

 

preventDefault ()

阻止執行預設的事件處理函數。例如若阻止了a元素的onclick事件，那麼將不會引發頁面導航。

$addHandler ($get ("showMoreLink"), "click", showMore);

function showMore (e) { e.preventDefault (); }

 

stopPropagation ()

阻止事件冒泡傳遞至父元素。

 

Event對象的屬性

1. altKey：判斷觸發事件時Alt鍵是否被按下。
2. button：得到觸發事件的滑鼠按鍵。可選值為Sys.UI.MouseButton枚舉（leftButton、middleButton和rightButton）。
3. charCode：得到觸發事件時的鍵盤按鍵代碼。可以為Sys.UI.Key枚舉（backspace, tab, enter,esc, space, pageUp, pageDown, end, home, left, up, right, down, del）。
4. clientX：滑鼠指標相對於文檔可見地區的X座標。
5. clientY：滑鼠指標相對於文檔可見地區的Y座標。
6. ctrlKey：判斷觸發事件時Ctrl鍵是否被按下。
7. offsetX：滑鼠指標相對於觸發事件元素左側邊緣的位移位置。
8. offsetY：滑鼠指標相對於觸發事件元素上邊緣的位移位置。
9. rawEvent：原始的DOM事件。
10. screenX：滑鼠指標相對於瀏覽者螢幕的X座標。
11. screenY：滑鼠指標相對於瀏覽者螢幕的Y座標。
12. shiftKey：判斷觸發事件時Shift鍵是否被按下。
13. target：觸發事件的對象。
14. type：事件名稱（例如“click”）。