11548 sujets

JavaScript, DOM et API Web HTML5

Problème pour associer une fonction à un onclick

Bonsoir,
Je vais essayer de vous donner un autre exemple que le post précédent.
Voici une fonction toute bête:
<html>
	<head>
		<script type="text/javascript">
		function init_lien()
		{
			var tab_lien = document.getElementsByTagName('a');
			for(var i=0; i<tab_lien.length; i++)
				tab_lien[ i].onclick=function(){ alert(i); };
				
		}
		</script>
	</head>
	
	<body onLoad="init_lien();">
		<a href="#">Lien 1</a>
		<a href="#">Lien 2</a>
		<a href="#">Lien 3</a>
	</body>
</html>


Mon problème précédent se résume à celui ci. Comment passer un paramètre à une fonction que l'on veut associer à un onclick. Dans le cas ci dessus (pas besoin de serveur web pour le tester), comment faire pour que l'on ai:
a écrit :
clic lien 1 -> affiche "1"
clic lien 2 -> affiche "2"
clic lien 3 -> affiche "3"


Actuellement j'ai
a écrit :
clic lien 1 -> affiche "3"
clic lien 2 -> affiche "3"
clic lien 3 -> affiche "3"



Bien entendu cette fonction n'est la que pour illustrer, et elle ne sers à rien.
Modifié par koala64 (10 Jul 2008 - 03:03)
Salut,
Ton problème est simple à trouver: lorsqu'un lien est cliqué, il envoie la fonction "alert(i);"
Sauf que la valeur de i n'a pas été fixée à chaque tour de boucle: sa valeur change à chaque tour. Donc à la fin de ta boucle, i à la valeur 3. chaque lien a pour fonction (au clic): "alert("3");", simplement

Voila de quoi faire fonctionner ce que tu veux Smiley smile 
<html>
	<head>
		<script type="text/javascript">
function init_lien() {
	var tab_lien = document.getElementsByTagName('a');
	for(var i=0; i<tab_lien.length; i++) {
		procedure(tab_lien[ i], i);
	}
}
function procedure(param1, param2) {
	param1.onclick = function() {
		alert(param2 + 1);
	};
}
		</script>
	</head>
	
	<body onLoad="init_lien();">
		<a href="#">Lien 1</a>
		<a href="#">Lien 2</a>
		<a href="#">Lien 3</a>
	</body>
</html>


Il existe peut-être un autre moyen que celui-là, mais il fonctionne et c'est le seul que j'ai trouvé

Justin
Modifié par koala64 (10 Jul 2008 - 03:02)
Salut,

Je suis d'accord avec Justin. J'ajouterais l'alternative suivante :
function init_lien() {
  var tab_lien = document.getElementsByTagName('a');
  for (var i=0; i<tab_lien.length; ++i) {
    tab_lien[ i].onclick = function(i) {
      return function() {
        alert(i);
      };
    }(i);
  }
}

Modifié par Julien Royer (10 Jul 2008 - 08:17)
Sujet clos
Aller à