Webmaster Hub > pb changement classe javascript

Version complète: sur le forum Webmaster Hub : pb changement classe javascript

Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > AjaX et JavaScript

manuura

jeudi 17 avril 2008 à 21:26

Bonjour,

je me permets de solliciter votre aide car je sèche bêtement sur un bout de code javascript tout con depuis un bon moment.

Je m'explique.

Je souhaite au moment d'un clic sur un élément, modifier la classe de cet élément ainsi que celle d'autres éléments de la page.

J'ai donc un code html qui ressemble à ça :

CODE

avec comme fonction javascript :

CODE

function changeEtat() {
var a = document.getElementsByTagName('a');
    for (var i=0; a.length; i++) {
        if(a[i].className == 'on') {
            a[i].className = 'off';
        }
    }
}

Donc ma fonction va chercher tous les éléments de classe 'on' et les passe en 'off'.
Sauf que firebug me renvoit l'erreur suivante :

CODE

a[i] has no properties
[Break on this error] if(a[i].className == 'on') {

Cela a pour conséquence de bien mettre mes autres éléments en classe 'off' mais je pense qu'il y a un pb avant la fin de ma boucle et que du coup mon action this.className='on' n'arrive jamais.

Voilà, je bloque là-dessus donc si quelqu'un pouvait m'indiquer comment débugger mon code, je lui en serai très reconnaissant.

Merci

P.S. : au passage, comment puis-je inclure mon this.className='on' dans ma fonction ?

manuura

jeudi 17 avril 2008 à 22:38

Résolu :

j'ai trouvé, il faut savoir écrire une boucle tout simplement :

CODE

for (var i in a) {
      if(a[i].className == 'on') {
         a[i].className = 'off';
      }
   }

captain_torche

vendredi 18 avril 2008 à 06:58

Je ne connaissais pas cette syntaxe : for(var i in a) : c'est l'équivalent d'un foreach ?
Sinon, l'erreur de ton précédent message était :
for (var i=0; i < a.length; i++)

Bovino

lundi 12 mai 2008 à 17:54

Pour ta question subsidiaire, rajoute

CODE

ça devrait le faire.

Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.