event概念及作用
在觸發DOM上某個事件時,會產生一個事件對象event,這個對象包含著所有事件相 關的信息,包含導致事件的元素,事件的類型以及其他的與特定事件相關的信息。
n它是事件綁定中的一個隱藏的參數,可以通過arguments[0]來獲取
n也可以叫事件源對象,這裡面包含瞭關於這次事件的相關信息
獲取方式(兼容問題)
n在W3C標準中,直接在函數中聲明該參數即可
btn.onclick = function(event) {
//這裡就可以使用瞭
};
n兼容性寫法,支持老版本的IE
var ev = ev ? ev : window.event;
var ev = ev || window.event;
event.button屬性介紹
alert(event.button); alert(ev.which);
//如果當前event是鼠標事件,則會有一個button屬性,它是一個數字
0代表鼠標按下瞭左鍵 || 1代表按下瞭滾輪 || 2代表按下瞭右鍵
n不過老版本的IE並沒有遵守W3C的規范,它的button屬性含義如下
nonmousedown/onmouseup
1鼠標左鍵 2鼠標右鍵3左右同時按4滾輪5左鍵加滾輪 6右鍵加滾輪 7三個同時
n目前IE11.0版本,無兼容性問題
鼠標事件中獲取鼠標的位置屬性介紹(兼容問題)
event.clientX鼠標相對於瀏覽器窗口可視區域的X坐標(窗口坐標),可視區域不包括工具欄和滾動條。
event.pageX類似於event.clientX,但它們使用的是文檔坐標而非窗口坐標。(ie8及以下不支持)
event.offsetX鼠標相對於事件源元素(srcElement)的X坐標。
event.screenX鼠標相對於用戶顯示器屏幕左上角的X,Y坐標。
鍵盤事件(keyup、keydown、keypress)
組合鍵ctrlKey、altKey、shiftKey
if(event.keyCode == 13 && event.ctrlKey) {
//發送消息
}
keyCode/which兼容
event.keyCode || event.which
alert(event.which); //IE不支持(ie8)
事件的冒泡(事件從子節點向上依次傳遞給父節點)
IE的事件流叫做事件冒泡(event bubbling) ,即事件開始時由最具體的元素(文檔中嵌套 層次最深的那個節點)接收,然後逐級向上傳播到較為不具體的節點(文檔)