Problème avec les écouteurs d'événements

Question

Dans ma tentative d'apprendre le JavaScript de base, j'apprends maintenant sur EventListeners.

Mon problème est que dans le code ci-dessous EventListener ne pas être tiré dans IE (fonctionne très bien dans Firefox et Chrome). Est-ce que quelqu'un peut me dire ce que je fais de mal?

Mon code est:

<p>The first captain of the USS Enterprise NCC-1701 was 
      <a id="wikipedia" href="http://en.wikipedia.org">Christopher Pike</a>. 
     </p> 

     <script type="application/javascript"> 

       var link = document.getElementById("wikipedia"); 
       // for firefox and other browsers 
       if (typeof link.addEventListener != "undefined") 
       { 
        link.addEventListener("click", clickListener, false); 
       } 
       // IE only 
       else if (typeof link.attachEvent != "undefined") 
       { 
        link.attachEvent("onclick", clickListener); 
       } 

       function clickListener() 
       { 
        var link = document.getElementById("wikipedia"); 
        link.setAttribute("href", "www.mysite.com/"); 
        open("http://www.mysite.com"); 
        return false; 
       } 
     </script> 

Answer 1

Est-ce vraiment le code complet? Si oui, la référence devrait être 'clickListener' et non 'wikipediaLink.clickListener'. Le vrai problème est la valeur de l'attribut "application/javascript" n'est pas convivial, changez-le en "texte/javascript" et avec la fonction de référencement et vous devriez être bon. Par ailleurs, j'utiliserais une fonction abstraite addEvent - le mien en particulier corrige le problème du mot clé 'this' dans JScript et aussi en raison de l'assignation initiale il n'a pas besoin de vérifier si l'élément supporte la méthode addEventListener ou pas car il vérifie l'objet de la fenêtre première:

var addEvent = (function() { 
    function addEventIE(el, ev, fn) { 
     return el.attachEvent('on' + ev, function(e) { 
     return fn.call(el, e); 
     }); 
    } 
    function addEventW3C(el, ev, fn) { 
     return el.addEventListener(ev, fn, false); 
    } 
    return window.addEventListener ? addEventW3C:addEventIE; 
    })(); 

Utilisation:

addEvent(link, 'click', clickListener); 

Answer 2

Essayez de déterminer le navigateur en utilisant cette méthode:

theFunction = function() { alert("Clicked!"); }; 
theElement = document.getElementById('wikipedia'); 

// All modern browsers 
if (window.addEventListener) { 
    theElement.addEventListener('click', theFunction, false); 

// IE 
} else if (window.attachEvent) { 
    theElement.attachEvent('onclick', theFunction); 

// Failure 
} else { 
    alert("Your browser is definitely too old."); 
}