首页 > 代码库 > event
event
1.事件流;
捕获(ie部分不支持);
冒泡(有些事件不支持冒泡 => 例: focus);
2.事件处理;事件监听器;
element.on{EventName};
element.addEventListener / element.removeEventListener;
element.attachEvent / element.datachEvent;- ie专用;
3.时间代理;利用冒泡特性;
document.onclick = function (e){
var e = e || window.event;
var target = e.target || e.srcElement;
if (target.className == ‘className‘){
alert(‘Hello World!‘);
}
}
4.event对象;
event = > 标准浏览器中作为参数传递;
window.event => 在ie中; 当event结束时被销毁;
5.事件类型;
event.type = > mousedown/ mouseup/keydown/ keyup....;
6.触发事件的节点对象;
e.target => 标准浏览器中;
e.srcElement => 只存在与巨硬的浏览器之中;
7.阻止默认行为;
当 cancelable 属性为 true 时, event.preventDefault(); 才有效.
当 event.preventDefault(); 调用后, event.defaultPrevented; 为 Ture.
event.preventDefault();
event.returnValue = http://www.mamicode.com/true; - ie
兼容代码:
event.preventDefault = event.preventDefault || function(){event.returnValue = http://www.mamicode.com/true};
8.阻止事件冒泡;
event.stopPropergation();
event.cancelBubble = true; - ie;
9.组织后续事件处理函数和冒泡;
event.stopImmediatePropagation();
10.功能键;
altKey;
shiftKey;
ctrlKey;
metaKey; => ie 9 以下不支持;
11.others
event.bubbles => 事件是否是冒泡上来的;
event.isTruest - 是否是用户操作行为;
event.timeStamp;
12.事件类型;
Load(DOMCountentLoaded -IE9+;readystatechage- document.readystate[loading/loaded/interactive/complete];load;beforeunload;unload;abort;error;)
Control{focus-> 不冒泡; blur -> 不冒泡; focusin; focusout;select;change;resize;scroll;submit;reset;zoom}
Mouse{mouseenter->mousedown->mouseup->click->dbclick->mousemove->mouseleave->mouseover->mouseout->contextMenu}
Keyboard{keydown keyup keypress input}
DomMutation{DOMActivate;DOMFocusInDOMFocusOut;DOMAttrModified;DOMCharacterDataModified;DOMNodeInserted;DOMNodeInsertedIntoDocument;DOMNodeRemoved;DOMNodeRemovedFromDocument;DOMSubtreeModified;DOMContentLoaded}
13.光标位置;
clientX/clientY; -> 相对于 window;
pageX/pageY; -> 相对于document; ie8不支持;自己算吧,亲;
screenX/screenY ->相对于屏幕;
event