IE和其他主流的浏览器之间有很多的不兼容,有一些其他浏览器支持的方法在IE中并不能完美的支持,首先哪些支持呢?
1、直接在HTML代码的元素属性的位置为事件绑定处理程序;
2、使用JavaScript的 node.onclick=function(){}
IE8及之前的版本不支持addEventListener和removeEventListener,支持的是attachEvent()和detachEvent()
attachEvent()和detachEvent()都需要两个参数:
第一个参数是要绑定的事件(onclick、onmouseover.....注意和addEventListener不同)
第二个参数是要绑定的处理程序(匿名函数或者函数名,注意如果不是匿名函数,函数名不要加括号)
在使用addEventListener之前应该先检测当前浏览器是否支持该方法,可以将代码封装到一个对象中:
<button id="btn">按钮</button> <script> var eventUtil = { //type 传入 click mouseover,而不传onclick,mouseover addEvent : function(element, type, func){ if (element.addEventListener) { //所有主流浏览器,除了 IE 8 及更早 IE版本 element.addEventListener(type, func, false); } else if(element.attachEvent) { // IE 8 及更早 IE 版本 element.attachEvent(‘on‘+type, func); } else { var type = "on"+type; //element.type = func; //wrong,不会成功 element[type] = func; } }, removeEvent : function(element, type, func){ if (element.removeEventListener) { //所有主流浏览器,除了 IE 8 及更早 IE版本 element.removeEventListener(type, func, false); } else if(element.detachEvent) { // IE 8 及更早 IE 版本 element.detachEvent(‘on‘+type, func); } else { var type = "on"+type; //element.type = null; //wrong,不会成功 element[type] = null; } } } var btn = document.getElementById("btn"); function showOne(){ alert("one"); } eventUtil.addEvent(btn, "click", showOne); eventUtil.removeEvent(btn, "click", showOne); </script>