Discussion :

[progdebutant]

Bonjour

J'ai deux setInterval qui lancent chacun une action, l'un augmente une valeur et l'autre la diminue.
Donc quand l'un démarre il faut qu'il stoppe l'autre, car on ne peut pas à la fois augmenter une valeur et la diminuer, il faut que ce soit alternatif.

Celui qui augmente est démarré par onmouseover() et celui qui diminue est démarré par onmouseout().

Mon problème c'est que le nom du setInterval n'est pas reconnu par celui qui veut le stopper.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
function augmente(){
   var valeur++;
   console.log(valeur);
}
 
function diminue(){
   var valeur--;
   console.log(valeur);
}
 
boite.onmouseover=function(){plus=setInterval("augmente();", 100);}
 
boite.onmouseout=function(){moins=setInterval("diminue();", 100);}

[Eric2a]

Salut,

Les variables utilisées par les fonctions doivent être préalablement déclarées.

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
17
var plus, moins, valeur=0; // Déclaration globale
 
function augmente(){
	valeur++;
	clearInterval(moins);
	console.log(valeur);
}
 
function diminue(){
	valeur--;
	clearInterval(plus);
	console.log(valeur);
}
 
boite.onmouseover=function(){plus=setInterval(augmente, 100);}
 
boite.onmouseout=function(){moins=setInterval(diminue, 100);}

EDIT : En fait pour éviter d'avoir trop de variables globales, il est préférable d'utiliser une closure. Ainsi les variables nécessaires à la fonction restent "privées".

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
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
var myFunction=function(){
	var id,value,step,byStep,delay;
 
	function show(){
		value+=step;
		console.log('valeur : '+value + ' ; Pas : '+step);
	}
 
	return{
		augmente:function(){
			step=+byStep;
			if(!id)id=setInterval(show,delay)
		},
		diminue:function(){
			step=-byStep;
			if(!id)id=setInterval(show,delay)
		},
		setValues:function(v,d,s){
			if(id){clearInterval(id);id=null}
			value=typeof v=='number'?v:0;
			delay=typeof d=='number'?d:100;
			byStep=typeof s=='number'?Math.abs(s):1;
		}
	};
}();
 
var boite=document.getElementById('boite');
 
myFunction.setValues(0,500,2); // La valeur initiale 0 sera modifiée toutes les 1/2 secondes par pas de 2
 
boite.onmouseover=myFunction.augmente; 
boite.onmouseout=myFunction.diminue;

[progdebutant]

Je te remercie de ton aide
Tes explications sont très utiles pour moi, je vais essayer de comprendre ces closures grace à ton code et sur un tuto, Merci encore, je vais tester tout ça, au premier abord ça semble pas évident

[progdebutant]

Merci je suis super content ça marche, il faut que je me plonge un peu plus dans ces closures c'est magique

Je mets en résolu ^^