網上有關這方面的代碼比較多而亂,這裏整理一下並加以改進。
添加事件
var addEvent = function( obj, type, fn ) { if (obj.addEventListener) obj.addEventListener( type, fn, false ); else if (obj.attachEvent) { obj["e"+type+fn] = fn; obj.attachEvent( "on"+type, function() { obj["e"+type+fn].call(obj, window.event); } ); } };
移除事件
var removeEvent = function( obj, type, fn ) {
if (obj.removeEventListener)
obj.removeEventListener( type, fn, false );
else if (obj.detachEvent) {
obj.detachEvent( "on" +type, obj["e"+type+fn] );
obj["e"+type+fn] = null;
}
};
阻止事件(包括冒泡和默認行爲)
var stopEvent = function(e){
e = e || window.event;
if(e.preventDefault) {
e.preventDefault();
e.stopPropagation();
}else{
e.returnValue = false;
e.cancelBubble = true;
}
},
僅阻止事件冒泡
var stopPropagation = function(e) {
e = e || window.event;
if (!+"\v1″) {
e.cancelBubble = true;
} else {
e.stopPropagation();
}
}
僅阻止瀏覽器默認行爲
var preventDefault = function(e) {
e = e || window.event;
if(e.preventDefault) {
e.preventDefault();
}else{
e.returnValue = false;
}
}
取得事件源對象
var getEventTarget = function(e){
e = e || window.event;
var target = event.srcElement ? event.srcElement : event.target;
return target;
}
附:綁定onpropertychange事件
onpropertychange,它在一個元素的屬性發生變化的時候觸發,通常用在表單元素中捕獲其value值改變,它比onchange事件更實時捕獲它的改變,不過爲微軟私有事件。FF大體和它類似的有oninput事件,不過它只針對textfield與textarea的value屬性。safari,firefox,chrome與 opera都支持此事件。
var addPropertyChangeEvent = function (obj,fn) {
if(window.ActiveXObject){
obj.onpropertychange = fn;
}else{
obj.addEventListener("input",fn,false);
}
}