//跨浏览器封装 var EventUtil = { addHandler: function(element, type, handler) { if (element.addEventListener) { element.addEventListener(type, handler, false); } else if (element.attachEvent) { element.attachEvent('on' + type, handler); } else { element['on' + type] = handler; } }, removeHandler: function(element, type, handler) { if (element.removeEventListener) { element.removeEventListener(type, handler, false); } else if (element.detachEvent) { element.detachEvent('on' + type, handler); } else { element['on' + type] = null; } }, getEvent: function(event) { return event ? event : window.event; }, 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; } }, getCharCode:function(event){ if(typeof event.charCode =='number'){ return event.charCode; }else{ return event.keyCode; } }, getWheelDelta: function(event){ if(event.wheelDelta){ return (client.engine.opera&&client.engine.opera<9.5? -event.wheelDelta:event.wheelDelta); }else{ return -event.detail * 40; } }, getRelatedTarget: function(event) { if (event.relatedTarget) { return event.relatedTarget; } else if (event.toElement) { return event.toElement; } else if (event.fromElement) { return event.fromElement; } else { return null; } }, getButton: function(event) { if (document.implementation.hasFeature("MouseEvents", "2.0")) { return event.button; } else { 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; } } }, getClipboardText: function(event) { var clipboardData = (event.clipboardData || window.clipboardData); return clipboardData.getData("text"); }, setClipboardText: function(event, value) { if (event.clipboardData) { return event.clipboardData.setData("text/plain", value); } else if (window.clipboardData) { return window.clipboardData.setData("text", value); } } }; //使用方法: element.click = function(event){ event = EventUtil.getEvent(event); EventUtil.preventDefault(event); EventUtil.stopPropagation(event); } var divs = document.getElementsByTagName('div'); EventUtil.addHandler(divs[0],'click',handler1,false); function handler1(){ alert(this);//这里的this要当心,在ie下是window这个对象,其他情况下是当前元素 } EventUtil.addHandler(divs[0],'click',handler3,false); function handler3(){ alert('hello'); } EventUtil.addHandler(text[0],'keypress',function(event){ var event = EventUtil.getEvent(event); var charCode = EventUtil.getCharCode(event); if(!/[a-zA-Z]/.test(String.fromCharCode(charCode)) && charCode>9){ EventUtil.preventDefault(event); } }); EventUtil.addHandler(text[0],'paste',function(event){ var event = EventUtil.getEvent(event); var text = EventUtil.getClipboardText(event); console.info(text); if(!/^\d*$/.test(text)){ EventUtil.preventDefault(event); } }); EventUtil.addHandler(text[0],'copy',function(event){ var event = EventUtil.getEvent(event); EventUtil.preventDefault(event); });
事件的封装
最新推荐文章于 2021-08-12 17:09:28 发布