Ajouter 'addeventlistener' sur internet explorer


Commenter

Contenu du snippet

Voici une manière d'ajouter la fonction addEventListener sur Internet Explorer (testé sur la version 7) sans modifier Object.prototype .
addEventListener est une fonction décrite dans le DOM Level 2 et qui n'est pas encore prise en charge par IE.
La technique est d'overrider les fonctions getElementById, getElementByName, getElementsByTagName.
On stock l'ancienne méthode dans une variable (ex. : oldGetElementById)
et on appelle l'ancienne méthode à l'interieur du corps de la nouvelle, on modifie le ou les objets récupéré(s) , en ajoutant addEventListener et on retourne ces même objets.
- l'utilisateur (le coder) n'y a vu que du feu :)
- on ne modifie pas Object.prototype.
- on ne reecrit pas "vraiment" les fonctions puisqu'on les appelle de toute façons :)

Source / Exemple : 


//ce code est utile uniquement sur IE,donc
    //on vérifie qu'on est bien sur IE.
    var using_ie = typeof(ActiveXObject)!="undefined";
    if(using_ie)
    {
        //sauvegarde des ancienne méthodes.
        var oldGetElementById = document.getElementById;
        var oldGetElementsByName = document.getElementsByName;
        var oldGetElementsByTagName = document.getElementsByTagName;
        
        //override 
        document.getElementById = function(id)
        {
            //appel de l'ancienne méthode pour récupérer l'élement.
            var obj = oldGetElementById(id);
            //ajout des fonctions
            obj.addEventListener = addEventListener;
            obj.executeEvents = executeEvents;
            return obj;
        }
        //comme getElementById mais avec une boucle qui 
        //parcourt chacun des éléments.
        document.getElementsByTagName = function(tag)
        {
            var obj = oldGetElementsByTagName(tag);
            for(obj_i=0;obj_i<obj.length;obj_i++)
            {
                obj[obj_i].addEventListener = addEventListener;
                obj[obj_i].executeEvents = executeEvents;
            }
            return obj;
        }
        //identique à getElementsByTagName.
        document.getElementsByName = function(name)
        {
            var obj = oldGetElementsByName(name);
            for(obj_i=0;obj_i<obj.length;obj_i++)
            {
                obj[obj_i].addEventListener = addEventListener;
                obj[obj_i].executeEvents = executeEvents;
            }
            return obj;
        }
        
        //Ajoute l'évenement dans un Array.
        var addEventListener = function(eventName,callback,b)
        {
            //on donne un nom a l'array qui contiendra les callbacks.
            //chaque évenement possede un Array différent.
            var eventArrayName = "ieEventList_"+eventName;
            //Si l'array est inexistant on le crée et on
            //lui indique comment executer les fonctions.
            if(typeof(this[eventArrayName])=="undefined")
            {
                var me = this;
                this[eventArrayName] = new Array();
                this["on"+eventName] = function()
                {
                    me.executeEvents(eventName);
                }
            }
            //ajoute la fonction.
            this[eventArrayName].push(callback);
        }
        
        //execute la liste de fonctions se trouvant dans
        //l'Array attribué à un évenement.
        var executeEvents = function(eventName)
        {
            var eventArrayName = "ieEventList_"+eventName;
            if(typeof(this[eventArrayName])=="undefined")
                return;//au cas ou..
            //éxecution de chaque évenement.
            for(eventIndex=0;eventIndex<
                this[eventArrayName].length;eventIndex++)
            {
                this[eventArrayName][eventIndex]();
            }
        }
    }

Conclusion :


hehe

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (li9)