添加事件監聽器跨瀏覽器

Question

我的問題在這裏：爲什麼不這個代碼工作????? ......該消息未出現

我試圖將事件偵聽器添加到元素x事件單擊

function test() 
    { 
    alert("test"); 
    } 

var EventsCrossBrowsers = 
{ 
    addEvents:(function(element,event,func) 
       { 
        if(element.addEventListener) 
        { 
         return elemenet.addEventListener(event,func,false); 
        } 
        else if(elemenet.attachEvent) 
        { 
         return elemenet.attachEvent("on"+event,func); 
        } 
       }()); 
} 

var x =document.getElementById("test"); 

EventsCrossBrowsers.addEvents(x,"click",test); 

非常感謝jfriend00 .... 最smiple方式，我認爲： -

function test() 
{ 
    alert("test"); 
} 

function addEventsCrossBrowsers(elemenet,event,func) 
{ 
    if(elemenet.addEventListener) 
    { 
     elemenet.addEventListener(event,func,false); 
    } 
    else if(elemenet.attachEvent) 
    { 
     elemenet.attachEvent("on"+event,func); 
    } 
} 
var x =document.getElementById("test"); 
addEventsCrossBrowsers(x,"click",test); 

你的第二個方式幾乎是一樣的，除了我不明白的回報...... 再次感謝你......

Answer 1

在你functi上，我看到你正在使用elemenet和element他們應該是相同的拼寫。這至少是問題的一部分。

我也看到你的addEvents函數是一個自我執行的函數，在這方面沒有意義。它似乎應該只是一個正常的功能。

這是我的跨瀏覽器事件函數。除了添加一個用於添加事件處理程序的功能之外，它還將this指針和events對象標準化，以便在任何瀏覽器中對它們進行對待。

// add event cross browser 
function addEvent(elem, event, fn) { 
    // avoid memory overhead of new anonymous functions for every event handler that's installed 
    // by using local functions 
    function listenHandler(e) { 
     var ret = fn.apply(this, arguments); 
     if (ret === false) { 
      e.stopPropagation(); 
      e.preventDefault(); 
     } 
     return(ret); 
    } 

    function attachHandler() { 
     // set the this pointer same as addEventListener when fn is called 
     // and make sure the event is passed to the fn also so that works the same too 
     var ret = fn.call(elem, window.event); 
     if (ret === false) { 
      window.event.returnValue = false; 
      window.event.cancelBubble = true; 
     } 
     return(ret); 
    } 

    if (elem.addEventListener) { 
     elem.addEventListener(event, listenHandler, false); 
     return {elem: elem, handler: listenHandler, event: event}; 
    } else { 
     elem.attachEvent("on" + event, attachHandler); 
     return {elem: elem, handler: attachHandler, event: event}; 
    } 
} 

function removeEvent(token) { 
    if (token.elem.removeEventListener) { 
     token.elem.removeEventListener(token.event, token.handler); 
    } else { 
     token.elem.detachEvent("on" + token.event, token.handler); 
    } 
} 

如果你想不傳播和默認的預防辦法，但與this和event正常化簡單的版本，這將是這樣的：

// add event cross browser 
function addEvent(elem, event, fn) { 
    if (elem.addEventListener) { 
     elem.addEventListener(event, fn, false); 
    } else { 
     elem.attachEvent("on" + event, function() { 
      // set the this pointer same as addEventListener when fn is called 
      return(fn.call(elem, window.event)); 
     }); 
    } 
}