特徵一頁 |
二頁 |
三頁 |
四頁 |
五頁
方法一頁 |
二頁 |
三頁 |
四頁 |
五頁 |
六頁 |
七頁 |
八頁
操控器一頁 |
二頁 |
成員表
element 的方法
addEventListener()
removeEventListener()
attachEvent()
detachEvent()
Firefox, Safari, Chrome 使用 addEventListener, removeEventListener。
- 對指定的事件型態，加上新的事件操控器。其語法是：
元素物件.addEventListener(事件型態, 操控器, 捕捉旗);
- 對指定的事件型態，移除事件操控器。其語法是：
元素物件.removeEventListener(事件型態, 操控器, 捕捉旗)
元素物件是指 HTML 元素的物件。第一個參數是事件型態的字串，以下是 DOM Level 3 建議的型態，但是瀏覽器沒有全部應用：
- 用戶事件組（UIEvent, UIEvents）：DOMFocusIn, DOMFocusOut, DOMActivate, focus, blur。
- 文字事件組（TextEvent）：textInput。
- 鍵盤事件組（KeyboardEvent）：keydown, keyup。
- 滑鼠事件組（MouseEvent, MouseEvents）：click, dblclick, mousedown, mouseup, mouseover, mousemove, mouseout。
- 滑鼠多滾輪事件組（MouseMultiWheelEvent）：mousemultiwheel。
- 滑鼠單滾輪事件組（MouseWheelEvent）：mousewheel。
- 變動事件組（MutationEvent, MutationEvents）：DOMSubtreeModified, DOMNodeInserted, DOMNodeRemoved, DOMNodeRemovedFromDocument, DOMNodeInsertedIntoDocument, DOMAttrModified, DOMCharacterDataModified。
- 變動名稱事件組（MutationNameEvent ）：DOMElementNameChanged, DOMAttributeNameChanged。
- 基本事件組（Event, HTMLEvents）：abort, change, error, load, reset, resize, scroll, select, submit, unload。
操控器（event handler）通常是一個函式位址，此函式會針對發生的事件，作出指定的工作。
捕捉旗設為 true，則此宣告的操控器會最最優先執行。由子元素上傳的事件，則會被忽略。相同的操控器可以用不同的捕捉旗（true, false）宣告兩次，要分別移除。完全相同的宣告（捕捉旗也相同），後來的會被拋棄。
IE 使用 attachEvent, detachEvent。
- 對指定的事件型態，加上新的事件操控器。其語法是：
元素物件.attachEvent(事件型態, 操控器);
成功則回傳 true；否則回傳 false。
- 對指定的事件型態，移除事件操控器。其語法是：
元素物件.detachEvent(事件型態, 操控器)
IE 的事件型態有： onabort, onactivate, onafterprint, onafterupdate, onbeforeactivate, onbeforecopy, onbeforecut, onbeforedeactivate, onbeforeeditfocus, onbeforepaste, onbeforeprint, onbeforeunload, onbeforeupdate, onblur, onbounce, oncellchange, onchange, onclick, oncontextmenu, oncontrolselect, oncopy, oncut, ondataavailable, ondatasetchanged, ondatasetcomplete, ondblclick, ondeactivate, ondrag, ondragend, ondragenter, ondragleave, ondragover, ondragstart, ondrop, onerror, onerror, onerrorupdate, onfilterchange, onfinish, onfocus, onfocusin, onfocusout, onhashchange, onhelp, onkeydown, onkeypress, onkeyup, onlayoutcomplete, onload, onload, onlosecapture, onmessage, onmousedown, onmouseenter, onmouseleave, onmousemove, onmouseout, onmouseover, onmouseup, onmousewheel, onmove, onmoveend, onmovestart, onoffline, ononline, onpaste, onprogress, onpropertychange, onreadystatechange, onreset, onresize, onresizeend, onresizestart, onrowenter, onrowexit, onrowsdelete, onrowsinserted, onscroll, onselect, onselectionchange, onselectstart, onstart, onstop, onstorage, onstoragecommit, onsubmit, ontimeout, onunload。
上述方法最大的好處是，可以在一個事件型態加上多個操控器。你也可以直接用下法：
元素物件.handler=函式位址;
用這個方法，一個事件型態只能有一個操控器；但是大部分的情形，用這個方法就夠了。
事件發生時，會動態產生 event 物件，存放相關資訊。下面的範例測試，IE, Firefox, Safari, Chrome 都會將 event 物件放在操控器函式的第一個參數。IE 的情形較特殊，請參考 window 事件。
- 先增加新操控器，然後用滑鼠點灰色方塊，就會改變數字。
