EventUtil——跨瀏覽器的事件物件工具函式
阿新 • • 發佈:2018-12-13
var EventUtil = { addEvent: function(element, type, handler) { // 新增繫結 if (element.addEventListener) { // 使用DOM2級方法新增事件 element.addEventListener(type, handler, false); } 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, false); } else if (element.datachEvent) { element.detachEvent("on" + type, handler); } else { element["on" + type] = null; } }, getEvent: function(event) { // 返回事件物件引用 return event ? event : window.event; }, // 獲取mouseover和mouseout相關元素 getRelatedTarget: function(event) { if (event.relatedTarget) { return event.relatedTarget; } else if (event.toElement) { // 相容IE8- return event.toElement; } else if (event.formElement) { return event.formElement; } else { return null; } }, getTarget: function(event) { //返回事件源目標 return event.target || event.srcElement; }, preventDefault: function(event) { //取消預設事件 if (event.preventDefault) { event.preventDefault(); } else { event.returnValue = false; } }, stopPropagation: function(event) { if (event.stopPropagation) { event.stopPropagation(); } else { event.cancelBubble = true; } }, // 獲取mousedown或mouseup按下或釋放的按鈕是滑鼠中的哪一個 getButton: function(event) { if (document.implementation.hasFeature("MouseEvents", "2.0")) { return event.button; } else { //將IE模型下的button屬性對映為DOM模型下的button屬性 switch (event.button) { case 0: case 1: case 3: case 5: case 7: //按下的是滑鼠主按鈕(一般是左鍵) return 0; case 2: case 6: //按下的是中間的滑鼠按鈕 return 2; case 4: //滑鼠次按鈕(一般是右鍵) return 1; } } }, //獲取表示滑鼠滾輪滾動方向的數值 getWheelDelta: function(event) { if (event.wheelDelta) { return event.wheelDelta; } else { return -event.detail * 40; } }, // 以跨瀏覽器取得相同的字元編碼,需在keypress事件中使用 getCharCode: function(event) { if (typeof event.charCode == "number") { return event.charCode; } else { return event.keyCode; } } };