标签：
事件绑定兼容写法：
1.普通写法
<!doctype html> <title>javascript事件兼容写法</title> <meta charset="utf-8"/> <script type="text/javascript"> var addEvent = function(element,type,callback){ if(element.addEventListener){ element.addEventListener(type,callback,false); }else if(element.attachEvent){ element.attachEvent(‘on‘ + type,callback) } } window.onload = function(){ addEvent(document.getElementById(‘parent‘),‘click‘,function(event){ var event = event || window.event; var target = event.target || event.srcElement; if(target.nodeName.toLowerCase() == ‘li‘){ alert(target.id); } }); } </script> <ul id="parent"> <li id="test1">aaaa</li> <li id="test2">aaaa</li> <li id="test3">aaaa</li> <li id="test4">aaaa</li> <li id="test5">aaaa</li> <li id="test6">aaaa</li> </ul>
2.还可以用闭包的形式来实现
<!doctype html> <title>javascript事件兼容写法</title> <meta charset="utf-8"/> <script type="text/javascript"> var addEvent = (function(){ if(document.addEventListener){ return function(element, type,callback){ element.addEventListener(type,callback,false); } }else{ return function(element, type,callback){ element.attachEvent(‘on‘ + type,callback); } } })(); window.onload = function(){ addEvent(document.getElementById(‘parent‘),‘click‘,function(event){ var event = event || window.event; var target = event.target || event.srcElement; if(target.nodeName.toLowerCase() == ‘li‘){ alert(target.id); } }); } </script> <ul id="parent"> <li id="test1">aaaa</li> <li id="test2">aaaa</li> <li id="test3">aaaa</li> <li id="test4">aaaa</li> <li id="test5">aaaa</li> <li id="test6">aaaa</li> </ul>
事件移除兼容写法：
removeEvent()是用来移除addEventLIstener()的，detachEvent()是用来移除ie8以下attachEvent()事件的。
注：要使用removeEvent(detachEvent)移除事件时，addEventLIstener(attachEvent )的执行函数必须使用外部函数，否则无法移除事件
<!doctype html> <title>javascript事件兼容写法</title> <meta charset="utf-8"/> <script type="text/javascript"> var addEvent = (function(){ if(document.addEventListener){ return function(element, type,callback){ element.addEventListener(type,callback,false); } }else{ return function(element, type,callback){ element.attachEvent(‘on‘ + type,callback); } } })(); var removeEvent = function(element, type, callback){ if(element.removeEventListener){ element.removeEventListener(type,callback,false); }else if(element.detachEvent){ element.detachEvent(‘on‘ + type,callback); } } window.onload = function(){
//因为涉及到移除事件，所以事件的执行函数需要使用外部函数 var myCallback = function(event){ var event = event || window.event; var target = event.target || event.srcElement; if(target.nodeName.toLowerCase() == ‘li‘){ alert(target.id); } } addEvent(document.getElementById(‘parent‘),‘click‘,myCallback); removeEvent(document.getElementById(‘parent‘),‘click‘,myCallback); } </script> <ul id="parent"> <li id="test1">aaaa</li> <li id="test2">aaaa</li> <li id="test3">aaaa</li> <li id="test4">aaaa</li> <li id="test5">aaaa</li> <li id="test6">aaaa</li> </ul>
获取事件源兼容写法：
var getEvent = function(event){ event = event || window.event; return event.target || event.srcElement; }
阻止冒泡事件：
var stopPropagation = function(event){ if(event.stopPropagation){ event.stopPropagation(); }else{ event.cancelBubble = true; } }
阻止默认事件：
var preventDefault = function(){ if(event.preventDefault){ event.preventDefault(); }else{ event.returnValue = false; } }
标签：
原文地址：http://www.cnblogs.com/yangkangkang/p/5646416.html
