11544 sujets

JavaScript, DOM et API Web HTML5

Salut,

Je cherche une info en javascript. j'ai un script qui pour l'instant ne marche que si je fais l'appel à la fonction sur le onload.

hors il est possible ( mais pas obligatoire ) que la page ou je rajoute cette fonction est deja quelquechose dans le onload. j'aimerais eviter d'ecraser le onload.

j'ai vu le tuto suivant sur alsa.

j'ai tester la fonction

function  addEvent(oElem, sEvType, fn, bCapture)
{
   return oElem.addEventListener?
      oElem.addEventListener(sEvType, fn, bCapture):
      oElem.attachEvent?
         oElem.attachEvent('on' + sEvType, fn):
         oElem['on' + sEvType] = fn;
}


mais en vain. peut-etre un truc que j'ai pas compris? a quoi sert et comment s'emploie le dernier argument je le comprends mal.


actuellement je prefere encore ça

function addLoadEvent(func)
{
   var oldonload = window.onload;
   if(typeof window.onload != 'function')
   {
      window.onload = func;
   }
   else
   {
      window.onload = function()
      {
         oldonload();
         func();
      }
   }
}


mais ça ne me donne pas pleine satisfaction. ça marche bien si le onload precedent est une fonction anonyme sinon ya un bug.

quelqu'un pourrait me donner un truc qui marche bien pour ne pas ecraser le onload?
Modifié par CPascal (14 Apr 2008 - 20:50)
Bonsoir CPascal,

a écrit :
quelqu'un pourrait me donner un truc qui marche bien pour ne pas ecraser le onload?


Ne pas l'utiliser mais utiliser les gestionnaires d'événements. Un exemple de fonction (proche de celle que tu cites) pour cela :


function addEvent(element, evenement, code)
{
    if (element.addEventListener)
    {
        element.addEventListener(evenement, code, false);
    }
    else if (element.attachEvent) // pour IE
    {
        element.attachEvent('on' + evenement, code);
    }
} 


Après un simple appel à la fonction ci-dessus te permettra d'exécuter telle ou telle fonction (fonction1, fonction2 ...) selon un événement donné (load) pour un élément donné (window) :


addEvent(window, 'load', fonction1);
addEvent(window, 'load', fonction2); ...


Bonne continuation.
Romain
Modifié par yodaswii (14 Apr 2008 - 22:08)
bon ben je reste sur ma faim.

j'ai réussi a faire fonctionner mon truc sans passer par l'evenement onload.

ceci dit je n'avais pas réussi a faire fonctionner toutes ses fonctions. quand le onload arrivais ma fonction n'avait pas été appelé.

enfin merci quand même Smiley smile .
Modérateur
Salut, Smiley smile

Dans cette fonction :
function  addEvent(oElem, sEvType, fn, bCapture) {
   return oElem.addEventListener?
      oElem.addEventListener(sEvType, fn, bCapture):
      oElem.attachEvent?
         oElem.attachEvent('on' + sEvType, fn):
         oElem['on' + sEvType] = fn;
}
le paramètre bCapture est un booléen qui indique le mode de propagation des évènements au sein des différents éléments de ta page. On peut être soit en mode capturant soit en mode effervescent... (voir le tuto de Julien et les cours de Gilles pour plus de précisions) Ceci dit, IE ne comprend que le mode effervescent donc on peut transformer la fonction en :
function  addEvent(oElem, sEvType, fn, bCapture) {
   return oElem.addEventListener?
      oElem.addEventListener(sEvType, fn, bCapture || false):
      oElem.attachEvent?
         oElem.attachEvent('on' + sEvType, fn):
         oElem['on' + sEvType] = fn;
}

addEvent(window, 'load', maFonction);
ce qui permet de donner une valeur par défaut (tout en conservant la possibilité de la changer) et donc, de s'affranchir d'indiquer ce paramètre lorsque l'ajout d'un gestionnaire doit agir de manière analogue sur chaque navigateur.

Sinon, comme l'a dit yodaswii, mieux vaut ne jamais se servir du window.onload afin d'éviter tout conflit. Smiley cligne
Modifié par koala64 (16 Apr 2008 - 23:23)