編寫一個通用的事件監聽函數

直接上碼👍

var EventUtil = {
	// 獲得事件
	getEvent:function(event){
		return event ? event : window.event;
	},
	// 獲得事件的目標
	getTarget:function(event){
		return event.target || event.srcElement;
	}
	// 添加事件
	addEvent:function(element, type, handler){
		// DOM2級事件處理程序，false表示在冒泡階段處理事件程序
		if(element.addEventListener){
			element.addEventListener(type, handler, true);
		} else if(element.attachEvent){
		    // IE事件處理程序
			element.attachEvent("on" + type, handler);
		} else{
		    // DOM0級
			element["on" + type]=handler;
		}
	},
	// 移除事件
	removeEvent:function(element, type, handler){
		if(element.removeEventListener){
			element.removeEventListener(type, handler);
		} else if(element.detachEvent){
			element.detachEvent("on" + type, handler);
		} else {
			element["on" + type] = null;
		}
	},
	// 阻止事件默認行爲
	preventDefault:function(event){
		if(event.preventDefault){
			event.preventDefault;
		} else {
			event.returnValue = false;
		}
	},
	// 阻止事件冒泡和捕獲
	stopPropagation:function(event){
		if(event.stopPropagation){
			event.stopPropagation();
		} else {
			event.cancelBubble = true;
		}
	}
}

// 使用方法
var btn = document.getElementById("myBtn"),
    handler = function () {
        console.log("Clicked");
    };

EventUtil.addHandler(btn,"click",handler);
EventUtil.removeHandler(btn,"click",handler);
複製代碼