Discussion :

[Rapha_dev]

Bonjour tout le monde !

Je souhaite savoir comment afficher l'élément d'une liste à l'index de la valeur du compteur (qu'on modifie avec un appui sur une flèche gauche/droite).

Voici mon code (je ne vois pas où se trouve l'erreur...) :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
                        var i = 0;
			var fruit = ["Cerise", "Litchi", "Banane"];
 
			document.onkeypress = function(e) {
				switch (e.keyCode) {
					case 39: //keydown : ArrowRight
						i++;
						break;
					case 37:
						i--; //keydown : ArrowLeft
						break;
				}
			}	
 
			document.getElementById("compteur").innerHTML = fruit[i];

Merci d'avance pour vos éclaircissements...
(P.S : Le code que j'ai mis est entre les balises <script> et </script> et j'avais mis le div avant le script JS)

[Toufik83]

Bonjour,

ça fonctionne avec keydown au lieu de keypress (souvent on utilise keypress sur les <input> et les <textarea> ... mais pas le document), et puis tu dois mettre la ligne 16 à l'intérieur de la fonction et aussi ne pas oublier de gérer la valeur de la variable i quand elle est supérieur à la longueur du tableau fruit ou négative :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
 var i = 0;
 var fruit = ["Cerise", "Litchi", "Banane"];
 document.onkeydown = function(e) {
   switch (e.keyCode) {
     case 39: //keydown : ArrowRight
       if (i + 1 < fruit.length)  i++;
       break;
     case 37:
       if (i > 0)  i--; //keydown : ArrowLeft
       break;
   }
   document.getElementById("compteur").innerHTML = fruit[i];//cette ligne doit être à l'intérieur du callback keydown
 }

[Rapha_dev]

Merci beaucoup @toufik !!
Cela marche bien et j'ai appris de nouvelles informations grâce à vous !

Bonne soirée !