problème avec attachEvent

Signaler
Messages postés
544
Date d'inscription
vendredi 5 décembre 2003
Statut
Membre
Dernière intervention
20 mai 2005
-
Messages postés
544
Date d'inscription
vendredi 5 décembre 2003
Statut
Membre
Dernière intervention
20 mai 2005
-
Bonjour,
attachEvent, chez IE doit permettre d'attacher plusieurs "event handler" à un élément. Cela marche bien avec "onload", mais je coince sur d'autres éléments.


<html>
<head>
<script type="text/javascript">


function chg1(x){document.links[x].style.backgroundColor="red"}


function chg2(x){document.links[x].style.backgroundColor="blue"}


// erreur : "document.links[...].style a la valeur Nulle ou n'est pas un objet"


function init(){
for(var i=0; i < document.links.length; ++i){
document.links[i].attachEvent("onmouseover",function(){chg1(i)});
document.links[i].attachEvent("onmouseout",function(){chg2(i)});
}
}


window.attachEvent("onload",init);
</script>
</head>



[# lien]
[# lien]
[# lien]
[# lien]



</html>


Si j'enlève la boucle, ça fonctionne ?? :


function init(){
i=0 // ici sur le premier lien
document.links[i].attachEvent("onmouseover",function(){chg1(i)});
document.links[i].attachEvent("onmouseout",function(){chg2(i)});
}


Il doit y avoir une solution sans faire une usine à gaz? Merci d'avance pour votre aide.
A voir également:

3 réponses

Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
Bonjour,

il ne faudrait pas utiliser this ?
document.links[i].attachEvent("onmouseover",function(){chg1(this)});

j'ai un exemple "équivalent"

document.getElementById("toto"+i).setAttribute("onmouseover",
function(){chg1(this);});

Cordialement. Bul. ~Site~~[mailto:marcelBultez@tiscali.fr Mail]~
Messages postés
544
Date d'inscription
vendredi 5 décembre 2003
Statut
Membre
Dernière intervention
20 mai 2005
1
Merci Bultez pour ta réponse, mais elle équivaut à
document.links[i].onmouseover = function(){chg1(i)


La nouvelle valeur de l'attribut remplace la précédente, par contre, avec
attachEvent, ou addEventListener pour le DOM 2,
la valeur originelle n'est pas écrasée.
Voici un autre exemple:


<html>
<head>
<script type="text/javascript">


function chg1(x){document.links[x].style.backgroundColor="red";}
function chg2(x){document.links[x].style.color="white"}
function chg3(x){document.links[x].style.border="5px solid green"}


/*
function init(){
for(var i=0; i < document.links.length; ++i){
document.links[i].attachEvent("onmouseover",function(){chg1(i)});
document.links[i].attachEvent("onmouseover",function(){chg2(i)});
document.links[i].attachEvent("onmouseover",function(){chg3(i)});
}
}
// erreur : "document.links[...].style a la valeur Nulle ou n'est pas un objet"
*/
function init(){
i=0 // ici sur le premier lien
document.links[i].attachEvent("onmouseover",function(){chg1(i)});
document.links[i].attachEvent("onmouseover",function(){chg2(i)});
document.links[i].attachEvent("onmouseover",function(){chg3(i)});
}


window.attachEvent("onload",init);
</script>
</head>



[# lien]
[# lien]
[# lien]
[# lien]



</html>


Sans la boucle, ça fonctionne ?? :
Messages postés
544
Date d'inscription
vendredi 5 décembre 2003
Statut
Membre
Dernière intervention
20 mai 2005
1
J'ai trouvé sans pouvoir l'expliquer, et voici la version IE/Gecko DOM 2


<html>
<head>
<script type="text/javascript">


function init(){
for(var i=0; i < document.links.length; ++i){
with(document.links[i]){
if(document.attachEvent){ // IE 5+
attachEvent("onmouseover",function(){style.backgroundColor="blue";});
attachEvent("onmouseover",function(){style.color="white"});
attachEvent("onmouseout",function(){style.backgroundColor="white";style.color="blue"});
}
if (document.addEventListener){// DOM 2, NS6+
addEventListener("mouseover",function(){style.backgroundColor="blue";},true);
addEventListener("mouseover",function(){style.color="white"},true);
addEventListener("mouseout",function(){style.backgroundColor="white";style.color="blue"},true);
}
}
}
}
if(document.attachEvent)window.attachEvent("onload",init);
else window.addEventListener("load",init,true);
</script>
</head>




[# lien]
[# lien]
[# lien]
[# lien]



</html>