Javascript: plusieurs onclick dans la page

Fermé
Utilisateur anonyme - 30 avril 2012 à 12:30
 Utilisateur anonyme - 30 avril 2012 à 17:08
Bonjour,

Je débute en javascript et j'ai une question pour améliorer mon code.

J'ai fait une sorte de checkliste qui indique ce qu'il ne faut pas oublier pour organiser une manifestation. Je voudrais que les gens puissent cliquer sur les tâches qu'ils ont déjà réalisées. L'image (qui représente la tâche - sorte de pictogramme) devient alors en couleur. Mais s'ils ont cliqué par erreur, ils devraient pouvoir faire revenir le pictogramme en gris (image de départ).

J'ai fait un code comme cela:

Dans le head:

<script type="text/javascript">
cc=0;
function changeimage()
{
if (cc==0)
{
cc=1;
document.getElementById('myimage').src="images/MMG_farbig_02.gif";
}
else
{
cc=0;
document.getElementById('myimage').src="images/MMG_grau_02.gif";
}
}
</script>

Dans le body:

<img id="myimage" onclick="changeimage()" border="0" src="images/MMG_grau_02.gif" width="143" height="122" />

Mais comme j'ai une cinquantaine de point, ça devrait le faire pour chaque image. Du coup, j'ai simplement refait la fonction:
-------
cc=0;
function changeimage2()
{
if (cc==0)
{
cc=1;
document.getElementById('myimage2').src="images/MMG_farbig_03.gif";
}
else
{
cc=0;
document.getElementById('myimage2').src="images/MMG_grau_03.gif";
}
}
-----

ça marche bien mais j'aurais voulu savoir s'il existait une méthode plus "propre"?

Merci de votre aide!

2 réponses

Oui et heureusement que c'est possible ! (imagine la taille de la source si tu as 20 000 000 checkbox).

Pour se faire tu doit utiliser des arguments dans t'es fonctions JavaScript :


function changeimage(e) {

var element = document.getElementById(e);

if (element.src == 'images/[MON-IMAGE-GRISE].gif') {
element.src = 'images/[MON-IMAGE-COULEUR].gif'; }
else {
element.src == 'images/[MON-IMAGE-GRISE].gif'; }
}


Sur le onclick envoi lui l'argument (l'id) :

<img id="myimage" onclick="changeimage('myimage')" border="0" src="images/MMG_grau_02.gif" width="143" height="122" />

Ps : j'ai pas testé
0
Utilisateur anonyme
30 avril 2012 à 14:07
Merci pour ta réponse! Malheureusement, ça ne fonctionne pas...

En plus, comme je suis une bille, j'ai encore une question: ta seule fonction c'est "changeimage(e)" et tu répètes le "if" en changeant juste les noms des images?

Merci d'avance pour ta patience!
0
Utilisateur anonyme
30 avril 2012 à 14:14
Je te fait un exemple
0
Voila testé et fonctionnel : http://dl.dropbox.com/u/39569085/check.zip
0
Utilisateur anonyme
30 avril 2012 à 17:08
Je vais tester tout ça! merci beaucoup!
0