JavaScript添加IE事件處理程序
阿新 • • 發佈:2018-02-26
als 不能 type light div 匿名函數 綁定 use gpo
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>
JavaScript添加IE事件處理程序